CSS Animatable

Definition and Usage

Some CSS properties are animatable, meaning that they can be used in animations and transitions.

Animatable properties can change gradually from one value to another, like size, numbers, percentage and color.

Example

Animate the background-color from red to blue:

/* Code for old Chrome, Safari and Opera */
@-webkit-keyframes mymove {
from {background-color: red;}
to {background-color: blue;}
}/* Standard syntax */
@keyframes mymove {
from {background-color: red;}
to {background-color: blue;}
}

Try it Yourself »

Post Author: Zahid Farid