Animaux en CSS et JS

Des animaux en CSS et en JavaScript

Mis à jour en septembre 2017

Etant fan des expérimentations en CSS, JavaScript ou SVG… et encore plus lorsqu’ils mettent en œuvres des animaux, j’ai rassemblé ici les différentes réalisations que j’ai pu trouver. Tout ça pour le plaisir des yeux mais aussi pour le plaisir du code.

Des animaux en pur CSS

Meshi the CSS Dog par David Khourshid

See the Pen Meshi the CSS Dog by David Khourshid (@davidkpiano) on CodePen.0

Alex the CSS Husky par David Khourshid :

See the Pen Alex the CSS Husky by David Khourshid (@davidkpiano) on CodePen.0

Angry Birds par Rachel Bull :

See the Pen Angry Birds in Pure CSS by Rachel Bull (@rachel_web) on CodePen.0

CSS Animals par Ashley Nolan :

See the Pen CSS Animals by Ashley Nolan (@ashleynolan) on CodePen.0

CSS Eevee par David Khourshid :

See the Pen CSS Eevee by David Khourshid (@davidkpiano) on CodePen.0

CSS Cat Swinging on string par David Khourshid

See the Pen CSS: Cat Swinging on String by David Khourshid (@davidkpiano) on CodePen.0

Santa’s Reindeer par Ivan Odintsov

See the Pen Santa’s Reindeer by Ivan Odintsov (@ivanodintsov) on CodePen.0

Singing Octo par Ivan Odintsov

See the Pen Singing Octo CSS Animation by Ivan Odintsov (@ivanodintsov) on CodePen.0

 

Des animaux en CSS et animés en JavaScript

Chill the lion par Karim Maaloul :

See the Pen Chill the lion by Karim Maaloul (@Yakudoo) on CodePen.0

Cats vs ball of wool par Karim Maaloul :

See the Pen Cat vs ball of wool by Karim Maaloul (@Yakudoo) on CodePen.0

Paranoid vs shy birds par Karim Maaloul :

See the Pen Paranoid vs shy birds by Karim Maaloul (@Yakudoo) on CodePen.0

Sneeze the dragon par Karim Maaloul :

See the Pen Sneeze the dragon by Karim Maaloul (@Yakudoo) on CodePen.0

SVG Low PolyLion par GRAY GHOST :

See the Pen SVG Low PolyLion: Animated Polygons by GRAY GHOST (@grayghostvisuals) on CodePen.0

Longcat Scroll par Jon Kantner

See the Pen Longcat Scroll by Jon Kantner (@jkantner) on CodePen.0

 

Un tutoriel pour apprendre à animer en pur CSS et SVG

David Khourshid propose sur codrops un tutoriel pour animer ses animaux en CSS et SVG. Il est possible de récupérer directement les sources.

Tutoriel pour animer des animaux en CSS et SVG

Le tutoriel de David Khourshid : tympanus.net/codrops/2016/03/21/animated-animals-css-svg/

Un jeu qui met en scène des animaux créés en CSS et JavaScript

The frantic run of the valorous rabbit par Karim Maaloul :

See the Pen The frantic run of the valorous rabbit by Karim Maaloul (@Yakudoo) on CodePen.0

Un site présentant des animaux animés

Species in pieces est un site qui met en avant 30 spécimens en voie de disparition, ils sont créés en CSS et animés avec du JavaScript.

Species in pieces

 

 

Si j’en trouve d’autres ou si vous souhaitez m’en partager je mettrais à jour cet article.

Laisser un commentaire :

Votre adresse email ne sera pas publiée.

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.