Generador CSS Cubic Bezier
Drag the control points to create custom CSS easing functions. Preview animation and copy the code.
Ad Space
CSS Code
Ad Space
What Is Cubic Bezier?
CSS cubic-bezier() defines a custom timing function for CSS transitions and animations. The four numbers control two control points of a Bézier curve, allowing fine-tuned easing from ease-in to bounce-like effects.
What do the values mean?
The values (x1, y1, x2, y2) define two control points. X values must be between 0 and 1 (time), while Y values can exceed that range for overshoot/bounce effects.