Símbolos de superheroes creados solo con CSS3

Esto si que es increíble, Jordano Aragão es un conocedor avanzado de CSS3 y además aficionado a los superheroes que creo 4 símbolos de 4 superheros utilizando un solo elemento HTML, la etiqueta div con una clase y mucho CSS3 avanzado, los resultados son espectaculares y muy reales, se ven como si se tratase del trabajo profesional de un dibujante.

Gracias a que es CSS3 pueden ver el código completo y empezar a jugar con el para aprender como fue logrado tal efecto para un solo elemento HTML.

Reactor Arc de Iron Man

Screenshot_62

Green Lantern

Screenshot_60

Spiderman

Screenshot_59

Captain America’s Shield

Screenshot_57

Si jugaron un poco con el código se darán cuenta de que el truco  es utilizar las nuevo pseudoelementos :after y :before, los cuales pueden tener cualquier cosa adentro, como degradados, fondos o letras.

Vía: Google+

Deja un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad