Morpha UI

Animation

Motion libraries and easing references for UI animation.

Motion is the difference between a UI that feels cheap and one that feels considered. This is the short list I use to add movement without reinventing easing every time.

Overview

I keep animation deliberate: a real motion library for stateful transitions, Lottie when a designer hands me a vector animation, and a couple of easing references so my curves don't default to the browser's flat ease. I always respect prefers-reduced-motion (see Accessibility).

Tools

My pick

Motion is the default — it's already in this stack and covers everything from a fade to a full layout transition. When I need a hand-tuned curve I grab one from Epic Easing rather than eyeballing cubic-bezier values. Lottie only comes out when the design genuinely calls for illustrated motion; for product UI, code-driven motion keeps the bundle lean.

On this page