JSFiddle - React, Tailwind, and code Playground

HTML

<a class="star5">S</a>
<a class="star4">S</a>
<a class="star3">S</a>
<a class="star2">S</a>
<a class="star1">S</a>

CSS

a {
  position:relative;
  
}

a:nth-of-type(1) {
  left:70px;
  color: red
}

a:nth-of-type(2) {
  left:45px;
  color: blue
}
a:nth-of-type(3) {
  left:20px;
  color: brown
}
a:nth-of-type(4) {
  left:-5px;
  color: gold
}
a:nth-of-type(5) {
  left:-30px;
  color: black
}
a:hover, a:hover ~ a {
  color: green;
  cursor: pointer
}