Insira duas cores
Informe a cor frontal e o fundo sólido logo atrás.
FREE WCAG COLOR CONTRAST CHECKER
Verificador de contraste WCAG grátis
Veja na hora se as cores do texto e do fundo são legíveis segundo a WCAG 2.2.
As cores e os resultados não são enviados nem salvos em servidor.
- 1Inserir cores
- 2Ver contraste
- 3Copiar resultado
1 · Inserir cores
Escolha as cores para comparar
Use o seletor ou digite um HEX de 3 ou 6 dígitos.
2 · Ver contraste
Resultado de contraste WCAG 2.2
Relação de contraste—
- AA texto normal4,5:1 ou mais—
- AA texto grande3:1 ou mais—
- AAA texto normal7:1 ou mais—
- AAA texto grande4,5:1 ou mais—
- Componentes de UI3:1 ou mais—
3 · Copiar resultado
Prévia real das cores
Texto normal — confira se o conteúdo continua fácil de ler.
Texto grandeVerifica somente cores sRGB sólidas e opacas. Não analisa transparência, gradientes, imagens nem a página inteira.
Guia grátis de acessibilidade de cores
Confira um par legível com duas cores
Calcule grátis o contraste WCAG 2.2, sem conta ou instalação.Confira os limites
Veja AA e AAA para texto normal, grande e interface.
Use a prévia
Confira exemplos de texto e componentes em tamanhos práticos.
Entenda o contraste WCAG
Uma relação, limites diferentes
O mínimo muda conforme o tamanho e o nível.
Texto normal 4,5:1
A WCAG AA exige ao menos 4,5:1 para texto normal.
Texto grande 3:1
Texto grande passa em AA a partir de 3:1.
UI precisa de 3:1
Controles e gráficos necessários exigem 3:1.
FREE WCAG COLOR CONTRAST CHECKER FAQ
Dúvidas sobre contraste de cores
Veja uso grátis, limites WCAG e alcance.1O verificador é grátis?
Sim. É grátis, sem conta e sem limite de uso.
2Qual a diferença entre AA e AAA?
AAA exige contraste maior. Texto normal precisa de 4,5:1 em AA e 7:1 em AAA.
3O que é texto grande?
Na WCAG é aproximadamente 24px regular ou 18,66px em negrito.
4Este resultado prova que o site inteiro atende à WCAG?
Não. Ele calcula apenas duas cores sólidas opacas. Verifique também cores adjacentes reais, estados, imagens e outros requisitos.