Skip to content
Transforms and animation

animation-delay

Sets how long an animation waits before starting. A negative delay starts the animation partway through its timeline.

333 effects in the catalog use this property.

Syntax

animation-delay: <time>;

Watch out

Negative delays are an efficient way to create waves: give repeated items values such as `-.1s` and `-.2s` so one shared animation begins at different phases.

Effects using animation-delay

These are working effects from the catalog. Open a tile to inspect the full source.