<p>Flapjacks on a <a href="#">sunny warm</a> afternoon.</p>

:root {
  --mainColor: #ff9800;
}

body {
  align-items: center;
  display: flex;
  font-family: 'Montserrat', sans-serif;
  font-size: 2em;
  height: 100vh;
  justify-content: center;
}

a {
  background:
     linear-gradient(
       to bottom,
       var(--mainColor) 0%,
       var(--mainColor) 100%
     );
	background-position: 0 100%;
	background-repeat: repeat-x;
	background-size: 4px 4px;
  color: #000;
  text-decoration: none;
  transition: background-size .2s;
}

a:hover {
  background-size: 4px 50px;
}