Skip to main content

Brighten up your website with these animations

Pure CSS Animals

These cute icons come to life when you hover over them

To create impressive website visuals and animations you don't have to use photo editing software that will drag down your load speed. Instead you can create amazing CSS animation entirely using markup – and that's exactly what Pankaj Taneja has done with these adorable animated animals.

Pure CSS Animals is a collection of animated animals, people and icons all made entirely out of, you guessed it, CSS. Originally created as a way of testing the capabilities of HTML and CSS, Taneja has now uploaded some of the designs to Codepen for users to download and examine for free.

Supported by all modern browsers, these stylish animations are fully responsive across desktop, mobile and tablets, with each one bursting into life when you hover over them. As well as looking good on websites, they're a great way for designers to see how CSS animations work.

Pure CSS Animals

This caped crusader isn't all he seems...

Pure CSS Animals

Float along with this relaxing frog and lily pad

Pure CSS Animals

This laid-back hipster stolls along the screen

Pure CSS Animals

There she blows! We love this whale animation

Liked this? Read these!

Dom Carter

Dom Carter is a freelance writer who specialises in art and design. Formerly a staff writer for Creative Bloq, his work has also appeared on Creative Boom and in the pages of ImagineFX, Computer Arts, 3D World, and .net. He has been a D&AD New Blood judge, and has a particular interest in picture books.