Recolorindo ícones com filtros CSS
Quando não dá para trocar o fill do SVG com facilidade, uma pilha de filter pode tingir um asset preto na direção da cor da marca. Aproximações raramente são perfeitas—confira a prévia e ajuste se precisar.
Gerador de CSS Filter
Escolha uma cor hex alvo para gerar uma aproximação CSS filter() (invert, sepia, saturate, hue-rotate, brightness, contrast) útil em ícones monocromáticos.
Como funciona
- 1
Preencha os campos do formulário.
- 2
Mude modos ou opções, se houver.
- 3
Copie a saída quando estiver certa (muitas vezes atualiza ao vivo).
Por que usar esta ferramenta
- Funciona totalmente no seu navegador — nada é enviado a um servidor.
- 100% gratuito, sem cadastro e sem limites.
- Funciona em qualquer navegador moderno — sem app, sem extensão e sem conta.
Como usar Gerador de CSS Filter
Complete os campos em Gerador de CSS Filter. A saída é gerada no navegador — copie quando pronto.
Dicas para melhores resultados
Deixe opcionais vazios para um resultado mínimo.
Privacidade e processamento no navegador
Sempre que possível, Gerador de CSS Filter processa seus dados localmente com JavaScript nesta página. Rascunhos, segredos e trabalhos em andamento ficam no seu dispositivo por padrão. Prefira esse fluxo quando não quiser enviar textos sensíveis, tokens, senhas ou arquivos para um serviço de terceiros.
Perguntas frequentes
Funciona em qualquer imagem?
Foi pensado para ícones pretos (ou quase pretos). Fotos coloridas não mapeiam bem para uma única cor alvo.
Por que existe um valor de perda?
A perda estima o quanto o resultado filtrado se afasta da cor alvo; quanto menor, mais perto.
Meus dados são enviados ao usar esta ferramenta?
Na maioria das ferramentas do FlyUtils, não. O processamento acontece no seu navegador com JavaScript. Se alguma ferramenta precisar de servidor, isso estará claro na página.
Gerador de CSS Filter é gratuito?
Sim. Gerador de CSS Filter é gratuito, sem cadastro e sem limites artificiais para uso pessoal e profissional comum.
Gerador de CSS Filter funciona no celular?
Sim. A página é mobile-first: você pode colar conteúdo, ajustar opções e copiar resultados no telefone ou tablet.