Como funciona
Digite uma cor de texto e uma cor de fundo para ver a taxa de contraste, uma prévia ao vivo e se cada nível WCAG é atendido ou não. Se o par não passar, o verificador sugere a cor de texto mais próxima, com o mesmo matiz, que atinge 4,5:1, e um toque já a aplica.
Taxa de contraste = (luminância mais clara + 0,05) ÷ (luminância mais escura + 0,05)
Requisitos das WCAG
- Texto normal: pelo menos 4,5:1 para AA e 7:1 para AAA.
- Texto grande (24 px, ou 18,66 px em negrito): pelo menos 3:1 para AA e 4,5:1 para AAA.
- Botões, ícones e bordas de formulário: pelo menos 3:1 em relação ao que está em volta.
Dicas
- Texto cinza sobre branco costuma reprovar — confira também os textos de exemplo dos campos e as legendas.
- Um bom contraste ajuda todo mundo, inclusive quem lê no celular ao ar livre.
- Use o botão de inverter para verificar texto claro sobre fundo escuro.
Padrões e fontes
- A fórmula de contraste e os limites seguem os critérios de sucesso 1.4.3, 1.4.6 e 1.4.11 das WCAG 2.2 (W3C)
Última revisão 7 de outubro de 2026
Perguntas frequentes
Qual taxa de contraste eu preciso?
Texto normal precisa de 4,5:1 para WCAG AA e 7:1 para AAA. Texto grande precisa de 3:1 para AA e 4,5:1 para AAA.
O que conta como texto grande?
Texto com pelo menos 24 px, ou pelo menos 18,66 px em negrito.
O que fazer se as minhas cores reprovarem?
Use a cor sugerida. Ela mantém o matiz e a saturação e muda só a luminosidade até o par atingir 4,5:1.
O contraste importa para botões e ícones?
Sim. As WCAG pedem pelo menos 3:1 entre partes da interface, como botões, ícones e bordas de campos, e o que está em volta delas.
A transparência afeta o resultado?
O verificador usa cores sólidas. Para texto semitransparente, verifique a cor que você realmente vê sobre o fundo.