Cubic Bezier Editor

Drag the handles to design any easing curve. Animated preview, classic presets, and the cubic-bezier() value to copy straight into your CSS or Framer Motion config.

transition-timing-function: cubic-bezier(0.25, 0.10, 0.25, 1.00);

/* Framer Motion */
{ ease: [0.25, 0.10, 0.25, 1.00] }