galaxy/Inputs/PriyanshuGupta28_hungry-otter-56.html

<div class="rating">
  <input value="5" name="rating" id="star5" type="radio">
  <label for="star5"></label>
  <input value="4" name="rating" id="star4" type="radio">
  <label for="star4"></label>
  <input value="3" name="rating" id="star3" type="radio">
  <label for="star3"></label>
  <input value="2" name="rating" id="star2" type="radio">
  <label for="star2"></label>
  <input value="1" name="rating" id="star1" type="radio">
  <label for="star1"></label>
</div>

<style>
/* From Uiverse.io by PriyanshuGupta28 - Tags: input, rating, Rating Button, start rating */
.rating {
  display: flex;
  flex-direction: row-reverse;
 /* Reverse the order of the stars */
  font-size: 0;
 /* Remove the space between the elements */
}

.rating input[type="radio"] {
  display: none;
 /* Hide the radio buttons */
}

.rating label {
  font-size: 30px;
  color: rgba(187, 183, 183, 0.726);
 /* Empty star color */
  margin: 0 2px;
  cursor: pointer;
}

.rating label:before {
  content: "\2605";
 /* Unicode character for filled star */
}

.rating input[type="radio"]:checked ~ label:before {
  content: "\2606";
 /* Unicode character for empty star */
  color: #016bf5;
 /* Filled star color */
}

</style>