Motion
Motion Curve Library
A browsable library of easing curves with copy-ready values.
Runs entirely in your browser. Nothing is uploaded.
How to use
- Browse the grid of easing curves.
- Click a card to play its motion in real time.
- Copy the cubic-bezier value for CSS, an NLE or a motion tool.
Examples
- Ease in-out is the safe default for UI and title moves.
- Back-out gives a confident overshoot for a logo settle.
- Expo-out starts fast and glides to a stop for a snappy reveal.
Frequently asked questions
What format are the values?
Standard CSS cubic-bezier, four numbers. They paste straight into CSS and most motion and edit tools that accept bezier easing.
Do values go outside 0 to 1?
Yes, the back and overshoot curves use values beyond the range to create anticipation and bounce, which CSS and many NLEs accept.
Can I fine-tune a curve?
Use the Keyframe Easing Visualizer to drag handles and shape a custom curve, then copy the result.
