← TechnologyThe essentials of

Animation-duration: time applies to one cycle

Publisher: ResumeMaker • 1 source

Published: 23 Oct 2026 08:23 · Updated: 23 Oct 2026 08:23

AI source check: 22 Oct 2026 16:54. This is not editorial approval.

In a few sentences

In brief

animation-duration sets the length of one cycle rather than the total time for every repetition. Two iterations lasting 1s give two successive one-second cycles, excluding delay.

Useful to know

animation-duration sets the length of one cycle rather than the total time for every repetition. Two iterations lasting 1s give two successive one-second cycles, excluding delay. [1]

This distinction helps synchronise effects. Also inspect iteration count; duration alone may not explain the complete observed time.

Sources

For further detail and to check the information:

  1. [1] MDN — CSS animation-duration ↗