underline css animation hover

1.hover-underline-animation {
2  display: inline-block;
3  position: relative;
4  color: #0087ca;
5}
6
7.hover-underline-animation:after {
8  content: '';
9  position: absolute;
10  width: 100%;
11  transform: scaleX(0);
12  height: 2px;
13  bottom: 0;
14  left: 0;
15  background-color: #0087ca;
16  transform-origin: bottom right;
17  transition: transform 0.25s ease-out;
18}
19
20.hover-underline-animation:hover:after {
21  transform: scaleX(1);
22  transform-origin: bottom left;
23}