Imaginemos que queremos darle a nuestra página un toque antiguo o vintage con un aire retro. Aparte de utilizar elementos de diseño gráfico que nos evoquen estos tiempos una de las funciones que nos haría falta es mostrar las imágenes en blanco y negro aunque originalmente estén en color. Para ello vamos a utilizar los filtros de CSS3 que, aunque no están implementados en todos los buscadores, son ampliamente utilizados.
Para convertir nuestra imagen a blanco y negro debemos utilizar el siguiente CSS:
|
1 2 3 4 5 |
img { filter: gray; /* IE6-9 */ filter: grayscale(1); /* Firefox 35+ */ -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */ } |
con el cual vamos a obtener:
Imagen Original:
