8 excelentes ejemplos de uso de CSS3

Las técnicas relacionadas con CSS3 son cada vez más populares en Internet. Su uso está cada vez más extendidos en sitios web y hay muchos creativos que están experimentando hasta donde se puede llegar con esta técnica.

Recorriendo la web, podemos maravillarnos con diferentes ejemplos de inspiración, creatividad e inventiva.

A continuación veremos 10 excelentes ejemplos de uso de CSS3.

1. Fotos con estilo polaroid utilizando CSS3

Ejemplo: http://www.zurb.com/playground/css3-polaroids/
Explicación del código: http://www.zurb.com/article/305/easily-turn-your-images-into-polaroids-wi

2. Cartas que se apilan con CSS3

Ejemplo: http://designlovr.com/examples/dynamic_stack_of_index_cards/

3. Filtro para las imágenes con CSS

Ejemplos: http://www.cssportal.com/css-image-filters/ (para ver el código se debe hacer click sobre las imágenes que tienen filtro en los ejemplos y se mostrará el estilo de cada caso en una ventana modal)

4. Globos de diálogo con CSS3

Ejemplo: http://nicolasgallagher.com/pure-css-speech-bubbles/demo/
Explicación del código: http://nicolasgallagher.com/pure-css-speech-bubbles/

5. DropDown Menú con CSS3

Ejemplo: http://www.webdesignerwall.com/demo/css3-dropdown-menu/
Explicación del código: http://www.webdesignerwall.com/tutorials/css3-dropdown-menu/

6. Animaciones usando transformaciones

Ejemplo y código: http://www.the-art-of-web.com/css/css-animation/

7. Efectos de sombra en texto. Un excelente trabajo realizado utilizando grises

Ejemplo: http://line25.com/wp-content/uploads/2009/letterpress/demo/demo.html
Explicación del código: http://line25.com/tutorials/create-a-letterpress-effect-with-css-text-shadow

8. Asombrosos efectos de Overlay y uso de bordes de imágenes con CSS3

Ejemplo y explicación del código: http://www.zurb.com/playground/awesome-overlays

Consideraciones finales sobre el uso de CSS3

No hay dudas que la incorporación de las nuevas características que CSS3 ha traído al mundo de la Web han abierto la puerta a muchas ideas creativas.

Desde el uso de sombras hasta las animaciones, el uso de CSS3 en la Web moderna está cada vez más presente en los sitios que visitamos cada día. Está en manos de diseñadores y «artistas del código» aprovechar todas estas funcionalidades para lograr soluciones creativas en sus proyectos Web.

Más sobre Diseño y desarrollo Web

Acerca de Damián De Luca

Autor de los libros: Webmaster Profesional, HTML5: Comprenda el cambio y Apps HTML5 para móviles. Soy especialista en Desarrollo Web. Realizo proyectos basados en Inteligencia Artificial. Colaboré como autor y editor de contenidos para revistas, colecciones y diversos medios impresos y digitales. Brindo capacitaciones, clases de formación y consultorías sobre lenguajes de programación y herramientas para Desarrollo Web y móvil en modalidad online y presencial.