Twitter’s fav icon with CSS step function

Twitter’s new fav icon animation uses static image and the sprite sheet technique. This is the technique we use a lot in game design.

The CSSAnimation.rocks shows how we can archive the Twitter’s fav sprite sheet animation with CSS-only steps function.

Back in 2012, Simurai has demonstrated the same effect, which I have used in my classes and books. It’s demo overlays the movement of the sprite sheet to help you understand the technique better.