animation
A shorthand property that applies an animation to an element. It links the element to a set of @keyframes and defines how that animation should behave.
Quick example
.loader {
animation: spin 1s linear infinite;
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}Quick facts
Initial value
See individual propertiesInherited
No
Applies to
all elements
Animation type
notAnimatable
animation Browser Support
Widely available Since 2015 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
Safe to use without fallbacks.
43+
16+
9+
12+