Easing Function Generator

Create custom CSS cubic-bezier easing functions with visual curve editor for smooth animations.

Bezier Curve Editor

Control Point 1

X1:0.25

Y1:0.10

Control Point 2

X2:0.25

Y2:1.00

Presets

Duration: 1s

Cubic Bezier

cubic-bezier(0.25, 0.1, 0.25, 1)

Transition

transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);

Animation

animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);