Validador de CSS

O que este validador de CSS verifica?

Cole CSS e obtenha um relatório linha por linha de problemas estruturais e de sintaxe — o tipo de erro que quebra a análise, não o tipo que produz a cor errada. Especificamente, ele verifica:

• Chaves desequilibradas ({ / }) — um bloco de regra aberto mas nunca fechado, ou uma chave de fechamento à esquerda sem abertura correspondente.
• Parênteses desequilibrados dentro de valores, como um calc(100% - 10px faltando seu ) de fechamento.
• Strings literais não terminadas — uma abertura ' ou " sem fechamento correspondente antes de a linha terminar ou o arquivo terminar. Strings CSS não podem abranger várias linhas a menos que a quebra de linha seja escapada com barra invertida.
• Blocos /* comment */ não terminados — um abridor de comentário sem */ de fechamento.
• Blocos de regra vazios (selector {}) — sinalizados como aviso, já que são CSS tecnicamente válido mas quase sempre código deixado ou morto.
• Uma propriedade sem valor (color: ;) ou um valor sem propriedade (: red;).

Cada descoberta lista o número da linha, se é um erro ou um aviso, e uma mensagem em linguagem simples. Se nenhum dos acima for encontrado, você obtém um único resultado "CSS Válido — nenhum problema estrutural encontrado".

O que NÃO verifica

Este é um scanner estrutural leve, não um analisador CSS completo. Ele não valida a gramática de valor real do CSS — não vai capturar color: notacolor;, uma unidade inválida, um nome de propriedade digitado incorretamente, ou um valor não suportado para uma propriedade específica, porque isso requer conhecimento completo e em constante evolução da especificação CSS3 para cada propriedade. Para esse nível de validação, use o DevTools do seu navegador (o painel Styles esmaeça e sinaliza propriedades/valores que não reconhece) ou um linter dedicado como Stylelint.

Para quem é?

• Desenvolvedores procurando uma } ou ) ausente que está silenciosamente quebrando o resto de uma folha de estilos.
• Qualquer pessoa colando CSS de uma fonte desconhecida (um snippet, uma geração de IA, cópia-cola dos documentos) que deseja uma verificação rápida de sanidade antes de usá-lo.
• Revisores de código verificando blocos de regra vazios, provavelmente acidentais.

Como usar

1. Cole seu CSS na caixa de entrada — os resultados são atualizados em tempo real enquanto você digita.
2. Leia a tabela Linha/Tipo/Mensagem: erros são quebras estruturais que valem a pena consertar imediatamente; avisos (como blocos de regra vazios) valem a pena verificar, mas não quebram a renderização.
3. Copie ou baixe os resultados como CSV se precisar compartilhá-los.

FAQ

Vai capturar um erro de digitação como bakground-color? Não — nomes de propriedades desconhecidas são uma verificação semântica, não estrutural. O navegador simplesmente ignorará uma propriedade que não reconhece; esta ferramenta apenas informa quando o próprio CSS não pode ser analisado corretamente.

Por que sinaliza um bloco de regra vazio como aviso em vez de erro? selector {} é CSS válido — os navegadores o analisam bem — mas não faz nada, então é quase sempre um erro (uma declaração esquecida ou código morto deixado após edições).

Ele suporta CSS aninhado ou blocos @media? Sim — o rastreamento de chaves/parênteses/string/comentário funciona em qualquer profundidade de aninhamento, portanto @media, @supports e blocos de seletor aninhados são todos verificados da mesma forma.

Privacidade

A validação acontece inteiramente em seu navegador. Seu CSS nunca é enviado nem compartilhado em nenhum lugar.