Blog > graphic design

How to code smart text effects with CSS

Liven up your site with this playful text animation.

Rollover links are a great way to grab a user's attention, especially if they do something unusual or original. Middle Child has a great effect, seldom seen elsewhere, that captures each letter and splits them apart with animation, which kicks in when the visitor hovers over the word. The animation helps convey the sandwich brand's playful character. 

In this article, we show you how to recreate the effect on your site. For more inspiration, take a look at our guide to the best CSS animation examples (with instructions on how to code them).

Intrigued...then click