COMO INVERTER COR DE BOTÃO

Como inverter cor de imagem com filtro CSS?

Como inverter cor de imagem com filtro CSS?

Usa filter: invert(100%); para isso.

O filter invert do CSS inverte as cores da imagem, por exemplo se uma imagem é laranja com o invert 100% ela fica azul.

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">

imagem com a cor invertida em 100 porcento

.exemplo-75 img{
     filter: invert(75%)
}



<img src="caminho da imagem" class="exemplo-75">

imagem com a cor invertida em 75 porcento

exemplo-50 img{
     filter: invert(50%)
}

<img src="caminho da imagem" class="exemplo-50">

imagem com a cor invertida em 50 porcento

exemplo-25 img{
     filter: invert(25%)
}

<img src="caminho da imagem" class="exemplo-25">

imagem com a cor invertida em 25 porcento


exemplo-0 img{
     filter: invert(0%)
}

<img src="caminho da imagem" class="exemplo-0">

imagem com a cor invertida em 0 porcento



botão de compartilhamento whatsapp botão de compartilhamento no twiter botão de compartilhamento do site botão de compartilhamento no linkedin botão de compartilhamento whatsapp