CSS animations describe how CSS properties can be made to change smoothly from one value to another over a specified duration, similar to transitions, but offer greater control over the animation timeline.

Basic Animation: Glide From Top Run Sample | View Source

Basic Animation: Normal and Reverse Playback Run Sample | View Source

In effect, CSS animations make it possible to animate transitions, using keyframes to specify not only the start and end states of a style change, but possible multiple intermediate points in the animation timeline as well.

Basic Animation: Slide and Resize Run Sample | View Source

Basic Animation: Diagonal Glide with Rotate Run Sample | View Source

Moreover, the animation properties that comprise the CSS animations module allow authors to easily configure and customize the timing, duration, direction, iteration and other details of how the animation sequence should progress.

Basic Animation: Text and Image Bounce Run Sample | View Source

Basic Animation: Text and Image Zoom Run Sample | View Source

Animations present simple yet powerful visual effects that can help enhance usability and appeal on any web page.

Basic Animation: Fade-In Fade-Out Run Sample | View Source

Basic Animation: Gradient Shift Run Sample | View Source

Basic Animation: Image Crossfade Run Sample | View Source