JSFiddle - React, Tailwind, and code Playground

by Santosh Thakur

HTML

<a href="/account/login">Login / Register</a>

CSS

a {
  padding-top: 1px;
  padding-bottom: 1px;
  position: relative;
  color: red;
  text-decoration: none;
}

a {
  transition: all .2s ease;
}

a:hover {
  text-decoration: none;
}

a:after {
  content: " ";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: #919191;
  transition: width .2s ease;
  text-decoration: none;
}

a:hover:after {
  width: 100%;
  left: 0;
}