Animations

Skeletonic CSS library provides ready-to-use, cross-browser transitions, transformations, and animations.

Installation and usage

You will need to import skeletonic-animations.css to display the colours.

The CSS animations are based/inspired on Animate.css (Another thing from Daniel Eden).

Animation styles

Skeletonic CSS allow you to easily create flexible UI transitions and animations.

Here’s the list of all the CSS Animations and Transitions:

bounce, chameleon, chameleon-bg, fade-in, fade-out, flash, pop-in, pulse, rotation, shake, vanish-in, vanish-out, wobble, zoom-in

Bounce

The Bounce animation allows you to bounce content.

Chameleon Text

The Chameleon Text animation allows you to bounce content.

Chameleon Background

The Chameleon Background animation allows you to bounce content.

Fade in

The Fade in animation allows you to fade content.

Fade out

The Fade out in animation allows you to fade content.

Flash

The Flash animation allows you to bounce content.

Pop In

The Pop In animation allows you to bounce content.

Pulse

The Pulse animation allows you to bounce content.

Rotation

The Rotation animation rotates content from the center of origin.

Shake

The Shake animation allows you to bounce content.

Vanish In

The Vanish In animation allows you to bounce content.

Vanish Out

The Vanish Out animation allows you to bounce content.

Wobble

The Wobble animation allows you to bounce content.

Zoom In

The Zoom In allows you to scales content into view, starts very small and scales to full magnification.


The Anatomy of Skeletonic CSS - A lightweight, intuitive, accessible and ultra-responsive CSS Framework