Codepen Selection #2

Voici la seconde sélection de Codepens qui valent le détour. Contrairement à la 1ère sélection où je présentais qu’un seul codepen, cette-fois ci découvrez 3 codepen sur lesquels j’ai particulièrement accroché.

Slice Slider

Un carrousel simple, mais avec une transition très bien réalisée.

See the Pen Slice Slider by Stephen Scaff (@StephenScaff) on CodePen.

Sticky Slider

Ce carrousel vertical saura séduire par sa simplicité

See the Pen Sticky Slider Navigation (Responsive) by Ettrics (@ettrics) on CodePen.

Material navigation

Un concept de navigation original version Material Design

See the Pen Material flex header by Atticus Koya (@OfficialAntarctica) on CodePen.

Codepen ui #2 : Navigation material design pour vos carousels

Voici une démo simple mais efficace inspirée par le charte graphique de Google : Material Design. En passant d’un slide à une autre sur le carousel ci-dessous, on peut voir les cercles passés au slide suivant via une petite animation.

Qu’en pensez-vous ?

See the Pen Material Slider Dots by Tobias Reich (@electerious) on CodePen.

Codepen UI #1 : Animation d’un formulaire de login

Nouvel article, nouvelle catégorie : Codepen Sélection. Dans cette série d’articles vous découvrirez des concepts d’interface venant tout droit du célèbre codepen.io.

Pour ce premier, voici un beau concept d’animation qui vaut le détour ! D’abord imaginé par Jakub Antalík sur dribbble, c’est un codepen de David Khourshid qui donne envie à cette animation, et il n’y a pas à dire, le résultat est plus que plaisant ! Une belle interface utilisateur à découvrir ci-dessous.

Je vous invite à remplir les champs avec une adresse mail et valider le login 😉

See the Pen CSS/SVG Lines App Concept by David Khourshid (@davidkpiano) on CodePen.

login