JSFiddle - React, Tailwind, and code Playground

by oilvier

HTML

<a href="#">
	<span>Link</span>
</a>

SCSS

a {display: block;}
span {
	display: inline-block; 
	&:after {
		content:"";
		display: block;
		border-bottom: 1px solid red;
		transform: scale3d(0, 1, 1);
		transform-origin: left top;
		transition: transform .3s ease-out;
	}
}

a:hover {
	& > span:after {transform: scale3d(1,1,1);}
}