The animation-duration property defines how long an animation should take to complete one cycle.
The animation-duration property is used to specify how long the animation cycle should take.
The time is specified in seconds or milliseconds, and is initially set to ā0sā, which means that the animation occurs instantaneously.
You can specify one duration or multiple comma-separated durations. When you provide a list of comma-separated durations, this list is usually mapped to a list of values provided by other animation-related properties, such as the animation-delay, animation-timing-function, and animation-name properties, among others. Each list of values in these properties is treated kind of like an array, where each value in a list of values has its own index. Then, each value in a list of values is mapped to its corresponding value with the same index in the list provided in the other properties.
Syntax:
animation-duration: time|initial|inherit;