Easing Curve Comparator
Compare cubic-bezier() curves with draggable control points, the named CSS easings, steps() and a simulated spring — then race up to four of them.
t = 0.000 · current progress 0.0%
Curve type
Race lanes
Lane A follows the curve you are editing. Set each lane from the library.
CSS timing functions
/* current */ transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1); /* named CSS keywords */ linear · ease · ease-in · ease-out · ease-in-out · step-start · step-end /* spring (m=1, k=180, c=12) */ transition-timing-function: cubic-bezier(0.250, 1.500, 0.750, 1.000); transition-duration: 1039ms;
Sampled progress
| t | A (current curve) | B | C | D |
|---|---|---|---|---|
| 0 | 0.000 | 0.000 | 0.000 | 0.000 |
| 0.1 | 0.095 | 0.076 | 0.404 | 0.409 |
| 0.25 | 0.409 | 0.473 | 0.816 | 0.817 |
| 0.5 | 0.802 | 0.766 | 1.087 | 1.088 |
| 0.75 | 0.960 | 0.973 | 1.060 | 1.064 |
| 0.9 | 0.994 | 0.988 | 1.013 | 1.014 |
| 1 | 1.000 | 1.000 | 1.000 | 1.000 |
About this tool
The cubic-bezier curve is inverted with Newton–Raphson exactly as browsers do it, and the spring runs a real damped-harmonic-oscillator integration (m·x″ + c·x′ + k·x = k) whose settle time and overshoot are measured from the simulation. The cubic-bezier approximation of the spring is a least-squares fit to that simulation. Everything is computed and drawn in your browser.
- 100% free — no account needed
- Runs in your browser
- Nothing is uploaded
Frequently asked questions
Is Easing Curve Comparator really free?
Yes. Easing Curve Comparator is completely free on PureBrowser — every feature, with no account, no trial, and no credit card.
Does Easing Curve Comparator upload my data?
No. Easing Curve Comparator runs entirely inside your browser, so anything you type, paste, or open stays on your own device.
Do I need to sign up or install anything?
Neither. There is no account and nothing to download — open the page and Easing Curve Comparator is ready to use on desktop or mobile.
Does Easing Curve Comparator work offline?
Once the page has loaded, yes. All of the processing happens locally in your browser, so it keeps working without a connection.
More design & visual
CSS Gradient Generator
Create linear CSS gradients with a live preview.
CSS Box Shadow Generator
Build and preview CSS box-shadow values with one-click copy.
CSS Glassmorphism Generator
Generate frosted-glass CSS with backdrop blur and copy-ready styles.
QR Code Generator
Generate custom QR codes for any text or URL.
WiFi QR Code Generator
Generate a scannable QR code to share WiFi credentials instantly.
Letter Profile Picture
Generate avatar images from initials with custom colors.