The classic animation trick.

Ease in · ease out
MotionTime

Slow in, slow out.

Think about how a car pulls away from a stop — it gathers speed before it moves, and sheds it before it settles. Constant-speed motion reads as mechanical. Eased motion reads as alive.

Linear — evenly spaced, feels robotic
Ease in · ease out — clustered at the ends, feels considered

We put this curve on almost everything that moves on screen. It's a two-line CSS change that separates an interface that feels considered from one that feels robotic.

06

OFFSET
& DELAY

A slight delay between two or more elements creates softness and multi-layered movement. It also directs attention — signaling an element's place in the hierarchy, not just that it moved.

Want this level of care on your product?

Two motion patterns down. There are a few more on the Craft page — or skip straight to telling us what you're building.