JSFiddle - React, Tailwind, and code Playground

by Nick Hulea

HTML

<div>Home</div>

CSS

div {
  padding: 3px 6px;
  display: inline-block;
  position: relative;
}

div:after {
  position: absolute;
  bottom: 0;
  left: 50%;
  height: 1px;
  width: 0%;
  background-color: #444;
  display: block;
  content: '';
  transition: 0.3s;
}

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