JSFiddle - React, Tailwind, and code Playground

HTML

<br><br>
<span>какой-то текст</span>

CSS

span{
  position:relative;
  border-top:2px solid blue;
}

span:before{
  content:"";
  position:absolute;
  background-color:red;
  height:2px;
  top:-2px;
  left:0px;
  width:0%;
  transition:0.3s;
}

span:hover:before{
width:33%;
}