Get Started:


  p {
    background: linear-gradient(0deg, slateblue, slateblue) no-repeat right bottom /
      0 var(--bg-h); /*joga tudo para uma variavel*/
    transition: background-size 350ms; /* velocidade */
    --bg-h: 100%; /*para full-background change to 100% ou use .under class */
  }
  
  p:where(:hover, :focus-visible) {
    background-size: 100% var(--bg-h);
    background-position-x: left; /*direção */
    
  }
  p {
    --bg-h: 2px;
  }


simples :hover line



mais examples neste repo

https://github.com/codrops/LineHoverStyles