JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML>
<html>
    <body>
        <a href="www.ign.com">Link</a>
    </body>    
</html>

CSS

a {
	display: inline-block;
	position: relative;
	padding-bottom: 3px;
}
a:after {
	content: '';
	display: block;
	margin: auto;
	height: 3px;
	width: 0px;
	background: transparent;
	transition: width .5s ease, background-color .5s ease;
}
a:hover:after {
	width: 100%;
	background: blue;
}