Animation timeline

A timeline is where an animation is planned. It lays time out from left to right, usually in milliseconds (ms), so you can see what happens at each moment.

In the example, the same sphere is shown at 0, 300, 600 and 900 ms. Reading left to right tells you the order of events and how long the whole animation lasts.

Animation tools such as After Effects, Figma and Rive stack several tracks on one timeline, one for each element or property, so a button can change color while a card slides in.