You designed a new website, and you’re excited about it. You spent hours poring over the smallest details–finding just the perfect font, moving that icon down two pixels and over one, concocting a pleasantly eccentric color palette. What an incredibly perfect Sketch file, you think: Are there museums for this?
Hover effects have long been one of the easiest ways to add an element of interactivity to a website. Most commonly, we see them used to highlight text links or buttons. But their use can range far beyond the basics.
This is part 1 of a series of tutorials about practical use cases of CSS transitions, transforms, and animations. In this tutorial, we’ll look at a “flipping card” scenario, and implementation variations.