Test bezier curve transition

Some test transitions

 

  Or click separately on each transition

Move

Resize

Opacity (Crossfade)

Color

Rotate Text (360º)

TEXT

Scale (zoom in/out)

test
Create CSS3 Cubic Bezier Curve

CSS3 cubic Bezier curve

Create your own CSS3 stylesheet transition, with this cubic Bezier- or quadratic curve generator. For CSS3 transitions on modern browsers.

Transition time (ms):
1ms
5000ms

 

Use Quadratic curve

 

Css code snippet:
Transition »
Duration »
Move points by mouse-cursor, or use cursor keys
F1 select point 1 (P1)
F2 select point 2 (P2)
P1
P2