Verificador de Contraste de Cores
Verifique a taxa de contraste WCAG entre as cores do texto e do fundo.
Pré-visualização de texto grande
A pré-visualização de texto normal se parece com isto.
Sobre o Verificador de Contraste de Cores
Verifique se a combinação de cores do texto e do fundo atende aos requisitos de contraste de acessibilidade WCAG 2.1. AA é o padrão mÃnimo recomendado; AAA é o padrão avançado para melhor legibilidade.
O Que É Esta Ferramenta?
Verifique se uma combinação de cor de primeiro plano (texto) e cor de fundo atende aos padrões de contraste de acessibilidade WCAG 2.1. Obtenha instantaneamente a taxa de contraste e o resultado de aprovação/reprovação para os níveis AA e AAA.
Como Usar
- Escolha ou digite um valor hexadecimal para a cor de primeiro plano (texto).
- Escolha ou digite um valor hexadecimal para a cor de fundo.
- Confira a pré-visualização ao vivo e os resultados de aprovação/reprovação para cada nível WCAG.
Casos de Uso Comuns
- Verificar se as escolhas de cor de texto e fundo atendem às diretrizes de acessibilidade antes de lançar um design
- Escolher combinações de cores legíveis para botões, links e texto do corpo
- Auditar um site ou aplicativo existente quanto à conformidade de acessibilidade
Dicas e Truques
- AA (4,5:1) é o padrão mínimo que a maioria dos sites deve atender para texto normal.
- Textos grandes (18pt+ ou 14pt+ em negrito) têm uma taxa mínima exigida menor, pois são mais fáceis de ler com contraste reduzido.
Perguntas frequentes
Qual é a diferença entre conformidade WCAG AA e AAA?
AA é o padrão mínimo que a maioria dos sites deve atender, requerendo uma taxa de contraste de 4,5:1 para texto normal. AAA é um padrão mais estrict requerendo 7:1, destinado para conteúdo onde máxima legibilidade é crítica.
Por que texto grande tem uma taxa de contraste necessária menor?
Texto maior (18pt+ regular, ou 14pt+ em negrito) é inerentemente mais fácil de ler com contraste menor, portanto WCAG define uma taxa mínima reduzida de 3:1 para conformidade AA em texto grande comparado a 4,5:1 para texto normal.
Como a taxa de contraste é realmente calculada?
É baseada na luminância relativa de ambas as cores, calculada por fórmula WCAG, e expressa como uma proporção de 1:1 (sem contraste, cores idênticas) até 21:1 (contraste máximo, preto em branco).
E se minha combinação de cor falhar na verificação de contraste?
Tente escurecer a cor do texto, esclarecer o fundo ou aumentar o tamanho do texto para cair sob o limite de texto grande, que tem uma taxa necessária mais baixa.
As cores que testo são enviadas a qualquer lugar?
Não. A taxa de contraste é calculada inteiramente no seu navegador usando fórmulas padrão WCAG — nenhum dado de cor é transmitido ou armazenado.
Verifique a taxa de contraste WCAG entre as cores do texto e do fundo. Confirme a conformidade de acessibilidade AA/AAA instantaneamente, grátis e online.