CSS animation timing editor — cubic-bezier & steps (local)

Drag cubic-bezier control points or configure steps(); preview motion with your easing curve; copy transition- or animation-timing-function CSS — generated only in your tab.

Frequently asked questions

No. Timing-function CSS is formatted in this tab with no server round-trip. Nothing is sent to LocalTools servers for processing.

**cubic-bezier(x1, y1, x2, y2)** defines a smooth easing curve between keyframes. **steps(n, jump-*)** divides progress into discrete jumps—useful for frame-by-frame or typewriter effects.

See the complete tool directory