[Tutoriales] Efectos nuevos para las imagenes

Holiiii!!! Bueno, hoy os traigo nuevos efectos para ponerle a las imágenes de vuestro blog. Podéis utilizarlos en ESTE tutorial. Los descubrí hace un tiempo un blog, pero no apunté la dirección ni la puse en favortios, así que no me acuerdo de cual era, pero los créditos para el correspondiente blog ^^

Bueno, empecemos con los efectos:

Blur

Este efecto hace que las imágenes se desenfoquen:

-webkit-filter:blur(2px);

                

Grayscale

Este efecto hace que las imágenes se conviertan a escala de grises, es decir, tengan menos color. El máximo es 100%.

-webkit-filter:grayscale(40%);

                

Sepia

Este efecto hace que la imagen tenga un color sepia, que para el que no sepa, es a colores marrón claro, más o menos, como en las fotos antiguas.

-webkit-filter:sepia(0.8);

                 

Brightness

Este efecto nos sirve para aumentar o disminuir el brillo de las imágenes.

-webkit-filter:brightness(1.2);

                

Contrast

Con este efecto podemos regular el contraste en las imágenes.

-webkit-filter:contrast(1.5);

                

Hue-rotate

Este me encanta. Este efecto sirve para cambiar el color de la imagen. El máximo es 360.

-webkit-filter:hue-rotate(100deg);

                

Invert

Este efecto sirve para invertir el color de la imagen a la que le pongamos el efecto. El máximo es 1.

-webkit-filter:invert(0.8);

                

Saturate

Este efecto es para regular la saturación de la imagen. La saturación es el grado de color en una imagen, algo parecido a el efecto de Grayscale.

-webkit-filter:saturate(3.5);

                

Y ya está, ahora solo tienes que aplicarlo al tutorial que mencioné al principio del post, y cambiar el número que está en rojo. Cuanto más alto es el número más tendrá de ese filtro, y la mayoría es, dese 0 hasta 10, salvo algunos, que he puesto.

Bueno, y esto es todo, beshus y hasta mañana!!