En muchas ocasiones cuando un desarrollador o diseñador web lleva a cabo la maquetación de un proyecto, necesita aplicar determinados efectos en algunas imágenes. Vamos a mostrar unos filtros para aplicar los efectos más populares usando únicamente código CSS.

Efecto de desenfoque: tendremos que indicar un número de píxeles, proporcional a la intensidad del efecto.

Escala de grises: indicaremos el porcentaje de decoloración.

Invertir: invierte el color, la saturación y el brillo. Indicaremos el porcentaje de aplicación.

Tono sepia: indicaremos un porcentaje de aplicación del típico efecto “vintage”.

Rotando el color: ¿te imaginabas poder rotar el color de la imagen unos cuantos grados? Pues sí se puede, indicando los grados a rotar.

Brillo: indicaremos el porcentaje de brillo que queramos darle a la imagen.

Contraste: igual que en el caso anterior, indicaremos el porcentaje de contraste que nos interese.

Saturación: este es un efecto bastante popular que sirve para incrementar la saturación de color en imágenes subexpuestas. Indicaremos un porcentaje.

¿Simple verdad? Si tienes cualquier duda o conoces algún efecto que no hayamos incluido, puedes dejarnos un comentario.

Fuente: https://blog.endeos.com/