Verificador de Contraste de Cor (WCAG)
Verifique se o seu texto é legível: escolha uma cor de texto e outra de fundo e obtenha a razão de contraste WCAG 2.1 instantaneamente, com aprovação/reprovação para AA e AAA em tamanho normal, grande e componentes de interface. Uma pré-visualização ao vivo mostra exatamente como a combinação fica.
🔒 100% privado — seus arquivos nunca saem do seu navegador
Razão de contraste
—
Texto normal — a rápida raposa marrom salta sobre o cão preguiçoso.
Amostra de texto grande 24px
AA: 4.5:1 normal · 3:1 grande (≥18 pt ou ≥14 pt em negrito) · AAA: 7:1 normal · 4.5:1 grande.
Como usar Verificador de contraste WCAG
- 1 Escolha a cor do texto e a cor do fundo (ou cole códigos HEX).
- 2 Leia a razão de contraste e os veredictos AA / AAA para texto normal, texto grande e componentes de interface.
- 3 Ajuste até a combinação passar — a pré-visualização ao vivo mostra a combinação em tamanhos reais.
Perguntas frequentes
Que razão de contraste preciso?
A WCAG 2.1 exige 4.5:1 para texto normal (AA), 3:1 para texto grande (18 pt / 14 pt em negrito, AA) e 7:1 para o nível estrito AAA. Componentes de interface e objetos gráficos precisam de 3:1.
Como a razão é calculada?
A luminância relativa de cada cor é calculada com a fórmula WCAG (linearização sRGB e soma ponderada) e comparada como (L1 + 0.05) / (L2 + 0.05). O cálculo roda localmente enquanto você digita.
Minha combinação falha — o que posso mudar?
As correções mais rápidas: escurecer a cor do texto, clarear o fundo (ou vice-versa) ou aumentar o tamanho da fonte para que o limite de 3:1 de texto grande se aplique. Os tons e sombras da ferramenta Conversor de Cores ajudam a encontrar um vizinho aprovado rapidamente.