120 interface transitions as After Effects comps and matching CSS.
4.763 reviews
340 licences sold
After Effects
Lottie
CSS
Framer Motion
What it is
The motion vocabulary from our own work: page transitions, micro-interactions and loaders, each shipped twice — as an editable comp, and as code that behaves the same.
Handing motion over as a video file means a developer approximates it, and it ends up feeling wrong in a way nobody can name.
Every transition here exists as an After Effects composition for the pitch and as a CSS or Framer Motion snippet with the same curve and timing for the build. The easing values are the same numbers in both, which is the entire point.
Also included: the reduced-motion variant of each one, because a third of your users have that switch on and deserve better than nothing.
What makes it worth the money
Shipped twiceAn editable comp for the pitch, code with the same curve for the build.
Reduced-motion variantsEvery transition has a version for people who asked for less.
A look inside
Page transitions, side by side with their CSS.The easing library, plotted.
In the download
120 transitions as editable AE comps
Matching CSS and Framer Motion snippets
Lottie exports for the lightweight ones
A reduced-motion variant of every transition
The easing library as a single file
Specification
Transitions
120
Formats
AE comps, Lottie JSON, CSS, Framer Motion
Easing
One shared curve library
Works with
After Effects 2022+
Lottie
React
Framer Motion 11
Any CSS
Release history
v2.3
Added 24 view-transition API examples and Framer Motion 11 syntax.
Who looks after it
Actively maintained · last release 30 Apr 2026
YT
Yuki TanakaMotion Designer
The After Effects comps, the Lottie exports and every reduced-motion variant.