Como inverter cor de imagem com filtro CSS?
Inverter cor imagem CSS
Usa filter: invert(100%); para isso.
O parâmetro que neste caso está 100% pode ser nivelado para diminuir o contraste entre as cores, sendo o 0% a imagem original.
Veja abaixo os exemplos com a transição da cor das imagens:
.exemplo-100 img{
filter: invert(100%)
}
ficando o html:
<img src="caminho da imagem" class="exemplo-100">
.exemplo-75 img{
filter: invert(75%)
}
<img src="caminho da imagem" class="exemplo-75">
exemplo-50 img{
filter: invert(50%)
}
<img src="caminho da imagem" class="exemplo-50">
exemplo-25 img{
filter: invert(25%)
}
<img src="caminho da imagem" class="exemplo-25">
exemplo-0 img{
filter: invert(0%)
}
<img src="caminho da imagem" class="exemplo-0">
Quer acompanhar as novidade do site?
Leia mais em: ww.w3schools.com/cssref/css3_...
