A client wanted an animated image effect similar to somebody whimsically underlining a few words of text with an equally whimsical colored writing instrument.
Thankfully, this is pretty straightforward with the use of
keyframes in CSS. In a nut, we start with a
width attribute of
0 on the element we want to animate, then set the
animation property to the keyframes we defined, the timing function we want to use, the animation duration, and the fill mode. We could define each of these separately, but superfluous typing is for suckers.