Curve time → progress
Drag the round points to bend the curve. The square anchors set where the motion starts and finishes — everything between them is what CSS gets. Arrow keys nudge by 0.01, Shift + arrow by 0.1.
CSS editable — paste a curve in
Presets
Preview your curve vs. a constant speed
curve
linear
Ticks above are equal slices of time. Where they bunch up, the motion is slow; where they spread, it is fast.
900 ms
t 0.00
Readout
—peak speed
—overshoot
—back-swing
—progress now