Gerador de filtro CSS
Crie uma declaração CSS filter ou backdrop-filter a partir de controlos visuais.
Gerador de filtro CSS
Esta ferramenta cria uma declaração CSS filter (ou backdrop-filter) pronta para colar a partir de um conjunto de controlos visuais, eliminando a necessidade de memorizar a sintaxe para combinar desfoque, brilho, contraste, escala de cinzas, rotação de matiz, inversão, opacidade, saturação, sépia e drop-shadow numa única propriedade. É direcionada para qualquer pessoa que estiliza uma galeria de fotos, um efeito hover, um painel de vidro fosco ou um tratamento temático de imagem sem escrever manualmente a lista de funções de filtro.
Cada função tem o seu próprio campo, e o valor gerado lista apenas aquelas que foram realmente alteradas — assim, uma página com apenas um pequeno desfoque permanece curta em vez de listar nove funções inativas. O campo de ordem de funções controla a ordem em que são executadas, uma vez que os filtros CSS são aplicados da esquerda para a direita e reordená-los (aplicar desfoque antes ou depois de ajustar o contraste, por exemplo) pode alterar o resultado visual. Duas predefinições, vintage e preto e branco, definem um grupo inteiro de valores de uma vez para um aspecto comum. Ative "backdrop-filter" para filtrar o que está atrás de um elemento em vez do próprio elemento — a escolha padrão para painéis de vidro fosco — e mude o formato de saída para obter uma classe Tailwind de valor arbitrário em vez de uma linha CSS simples.
Os campos numéricos são automaticamente limitados a intervalos sensatos, portanto um valor acidentalmente grande ou negativo nunca quebra a saída; o campo de cor da sombra de queda aceita qualquer valor de cor CSS. O resultado atualiza-se em tempo real conforme ajusta qualquer opção, e a contagem acima da saída mostra quantas funções estão realmente ativas.
Tudo corre localmente no seu navegador — nada do que introduz aqui é carregado ou enviado para qualquer lugar. Copie o resultado, descarregue como ficheiro .txt ou envie para a entrada de outra ferramenta para continuar a trabalhar nela.