This week we're creating staggered animations, using some lovely React animated icons, and splitting text using Splitting.js.

♥️ Donovan at CSSAnimation.rocks

Different Approaches for Creating a Staggered Animation — css-tricks.com

Staggered animations can be tricky to set up - here's a guide to some ways of creating these list-enhancing transitions

A micro-animations library — useanimations.com

These animated icons for React projects look super useful!

Splitting.js

This looks like a very handy tool to keep bookmarked for when you want to split up some text and animate it!

Featured

Level Up Your CSS Animation Skills

As a reader, save 92% on my course. Join over 11,000 people learning all about CSS animation today!

Inspiration

Manic ball

This manic ball would make a terrible buy-now button!

Variable font animation

Lovely example of how variable fonts can be animated - also makes use of the awesome Splitting JS utility

Dark Armillary

These darkly glowing concentric globes are addictive

Pipes w/ Zdog + GSAP 😎

Lovely 3D work here from Jhey ✨

Hexagon kaleidoscope

Lovely little kaleidoscope effect using Canvas!

Easy Op Art with ZIM

Some interesting migraine-generating artwork with overlapping shapes

Showtime Parallax Effect

Vertical carousel that uses scrolling nicely (no jacking!) to flick through each card