Easing

How a movement speeds up and slows down between its start and its end.

Easing

See it in SVG path animator. Switch Easing between linear and ease-in-out, then press play.

In plain words

Real things rarely start or stop at full speed. A bicycle pulls away slowly and slows down before it stops. Easing gives animation the same feel by changing the speed along the way. Ease-in starts slow, ease-out ends slow, and ease-in-out does both. Linear keeps one speed from start to end, which often looks stiff. The steeper an easing curve, the faster the thing is moving at that moment.

Nearby

Used by