CSS Filter Generator

Ferramenta de filtro de imagem CSS online gratuita. Visualize efeitos de filtro em tempo real e gere código CSS com um clique. Suporta 10 parâmetros de filtro, 10 esquemas predefinidos, arrastar e reordenar, pré-visualização em lote de múltiplas imagens, desfazer/refazer e muito mais.

Ctrl+Z Desfazer Ctrl+Shift+Z Refazer Ctrl+H Comparar ao Passar Ctrl+R Redefinir Ctrl+C Copiar Código
🖼 Fonte da Imagem
Imagens de Exemplo
📁
Clique para enviar ou arraste a imagem
Suporta JPG / PNG / WebP, use Ctrl+V para colar
A partir de URL
Pré-visualização Múltipla (máx. 3)
🎭 Parâmetros de Filtro (arraste para reordenar | ativar/desativar)
🎨 Presets de Filtro
🎵 Efeito de Sobreposição
🌈 Conversor de Filtro de Cor
💾 Gerenciamento de Esquemas
Modo de Comparação: Lado a Lado
Original Original
Com Filtro Filtered
filter: property

O que é o Gerador de Filtros CSS Online?

CSS Filter Generator é uma ferramenta online gratuita e abrangente que ajuda você a adicionar efeitos de filtro CSS a imagens por meio de ajustes visuais. Nenhuma codificação necessária — ajuste controles deslizantes e parâmetros em tempo real e gere código CSS pronto para uso com um clique.

Principais Recursos

  • 10 Parâmetros de Filtro — blur, brilho, contraste, escala de cinza, matiz, inverter, opacidade, saturação, sépia, sombra projetada (com suporte a X/Y/desfoque/cor)
  • 10 Esquemas Predefinidos — Vintage, Preto & Branco, Fresco, Tom Frio, Tom Quente, Sépia, Filme, Alto Contraste, Branqueado, Lomo
  • Arrastar & Reordenar — Arraste itens de filtro para ajustar a ordem de aplicação, com ativação/desativação individual
  • Três Modos de Comparação — Lado a Lado, Comparação Deslizante (arraste o divisor), Comparação por Sobreposição (passe o mouse para revelar original)
  • Pré-visualização em Lote de Múltiplas Imagens — Carregue até 3 imagens de uma vez, aplique filtros uniformemente
  • Desfazer/Refazer — Suporta histórico de 20 etapas, Ctrl+Z / Ctrl+Shift+Z
  • Conversor de Filtro de Cor — Insira cores de origem e destino para calcular valores aproximados de filtro
  • Gerenciamento de Esquemas Personalizados — Salve/carregue/exclua esquemas de filtro personalizados no armazenamento local do navegador
  • Compartilhamento por Hash de URL — Compartilhe a configuração atual do filtro via parâmetros de URL
  • Baixar PNG — Exporte a imagem filtrada como PNG

Proteção de Privacidade

Todo o processamento de imagem é feito inteiramente no seu navegador. Nenhuma imagem é enviada para qualquer servidor. Use com confiança.

Dica: Use Ctrl+Z/Ctrl+Shift+Z para desfazer/refazer, Ctrl+H para alternar comparação ao passar, Ctrl+R para redefinir todos os filtros, Ctrl+C para copiar código CSS.