← Pencilbox
Ease
design an easing curve
build v6.0
Ease designs a CSS easing curve — drag the two control handles to shape how an animation speeds up and slows down, watch a dot move to that timing, and copy the cubic-bezier() value. Nothing is uploaded.
Presets
Play

The horizontal axis is time and the vertical axis is progress; the two handles are the cubic-bezier control points. Values outside 0–1 on the vertical axis create bouncy “overshoot” easings, which is allowed. Everything runs on your device.