Poordeveloper

CSS Loading Animation

Also check out - http://codepen.io/Vestride/pen/vHzyk

A Pen by John Urbank on CodePen.

License.

Poordeveloper

A simple one div loading

Simple loading indicator animation for @alpcanaydin

A Pen by Burak Can on CodePen.

License.

Poordeveloper

Water drop loader CSS animation

Every now and then I make something without JS just to make sure I still can :p

Fun fact, I originally made this with just HTML elements and border-radius for the circles. (As I suspected it would) the frame rate sucked. So I swapped in SVG circles and it is much better. The moral of this story is try to avoid using border-radius in your CSS anims if possible.

A Pen by Rachel Smith on CodePen.

License.

Poordeveloper

Clock spinner

A Pen by Andrew Liebchen on CodePen.

License.

Poordeveloper

Loader a Day (day 29)

We're almost there, just one more after this one and then it's on to a new adventure!

A Pen by Reinier Kaper on CodePen.

License.

Poordeveloper

OPpbbR - SVG Loader

A Pen by Ryan Allen on CodePen.

License.

Poordeveloper

CSS Loading Spinners

A collection of spinners using CSS, keyframes and basic animation. No JS.

A Pen by Beau on CodePen.

License.

Poordeveloper

Expand-contract loader animation

A quick experiment illustrating the use of same expand/contract animation but with a variety of rotation angles.

The end result is a synchronized 4 way animation

A Pen by Antonio Pavlinović on CodePen.

License.

Poordeveloper

Spin Cycle CSS-powered spinner from any inline SVG

Take any inline SVG and turn it into a spinner! Branding is super-flexible through a Sass mixin.

The only rule is that the things you want to animate have to be DIRECT CHILDREN of the parent SVG element.

A Pen by Chris Hart on CodePen.

License.

Poordeveloper

Hamburger Animated Icon

Just a little hamburger button ~ :3

Design by Creativedash https://dribbble.com/shots/1623679-Open-Close

A Pen by Kyosuke on CodePen.