Easing timing function

Easing lets an animation change speed as it plays, the way a bike builds up speed and then brakes. This makes digital movement feel more physical and natural.

In the example, both spheres cover the same distance in the same time. The linear one keeps a steady pace, while the eased one starts faster and settles gently at the end.

There are three common easing curves: ease-in, ease-out and ease-in-out. The next sections look at each one.