Every track runs the same distance on a loop, so the differences are in the timing, not the path. Watch two rows at once to compare.

Durations

instant — 100msState flips — checkbox, toggle
fast — 200msHover, focus, colour change
base — 300msMost transitions
slow — 500msEntrances, layout shifts
deliberate — 800msHero reveals, scroll effects

Easings

standard — cubic-bezier(0.4, 0, 0.2, 1)Default — moves in and settles
decelerate — cubic-bezier(0, 0, 0.2, 1)Entering the screen
accelerate — cubic-bezier(0.4, 0, 1, 1)Leaving the screen
expressive — cubic-bezier(0.16, 1, 0.3, 1)The one used across this library

Springs

snappy — stiffness 400, damping 30Tooltips, small pops
default — stiffness 300, damping 24Sliding indicators, tabs
soft — stiffness 160, damping 26Progress rails, large panels
bouncy — stiffness 500, damping 15Playful — use sparingly
follow — stiffness 220, damping 18

Rule of thumb: durations scale with distance. A 24px toggle at 500ms feels broken; a full-screen panel at 100ms feels like a cut. And anything above 800ms should be scroll-driven, not time-driven.