What does this do?
Lets you design a CSS easing curve visually. The two black handles set the curve's control points — drag them anywhere (even outside the box, for overshoot or anticipation) and the animation preview re-runs immediately.
How do I use the output?
Paste the generated value as a transition-timing-function or
inside an animation shorthand. It works anywhere CSS accepts a
timing function — transitions, keyframe animations, scroll-linked
animations.
What's "overshoot"?
When a control point's Y coordinate goes above 1 (or below 0), the curve
briefly leaves the 0–1 range — meaning the animated value overshoots its
target and settles back. That's how a button "bounces" into place or a
modal "snaps" open. The out-back preset is the classic
example.
Is anything uploaded?
No. The curve is solved and rendered in your browser.