Coordinate Plane
Point 1 (P1) 0.25, 0.10
Point 2 (P2) 0.25, 1.00
Curated Presets
Tip: Drag the red (P1) and blue (P2) dots. In CSS cubic-bezier, X is clamped between 0 and 1, while Y values outside [0, 1] generate elastic overshoots.
Live Motion Simulator
Your Cubic-Bezier Curve (custom)
0.25, 0.10, 0.25, 1.00
Linear Baseline (Constant Speed)
linear
Scale
Opacity
Rotation
Generated CSS Rule
✓ Copied to clipboard
transition-timing-function: cubic-bezier(0.25, 0.10, 0.25, 1.00);