Verificador de contraste de paleta

Compare todos os pares de cores HEX de uma paleta com os limites WCAG para contraste de texto.

Preparando ferramenta…

Testar um exemplo explicado

Compare todos os pares de cores HEX de uma paleta com os limites WCAG para contraste de texto.

Confira as unidades e opções e use o botão de cálculo da ferramenta. O exemplo é fictício; substitua os valores para fazer seu próprio cálculo.

Texto de exemplo

Cores da paleta (uma cor HEX por linha): #000000 #ffffff #2563eb

Resultado esperado

| Cor 1 · #000000 | Cor 2 · #ffffff | Cor 3 · #2563eb
Cor 1 · #000000 | — | 21,00:1 · AA texto comum ✓ · AAA texto comum ✓ · AA texto grande ✓ · AAA texto grande ✓ | 4,06:1 · AA texto comum × · AAA texto comum × · AA texto grande ✓ · AAA texto grande ×
Cor 2 · #ffffff | 21,00:1 · AA texto comum ✓ · AAA texto comum ✓ · AA texto grande ✓ · AAA texto grande ✓ | — | 5,17:1 · AA texto comum ✓ · AAA texto comum × · AA texto grande ✓ · AAA texto grande ✓
Cor 3 · #2563eb | 4,06:1 · AA texto comum × · AAA texto comum × · AA texto grande ✓ · AAA texto grande × | 5,17:1 · AA texto comum ✓ · AAA texto comum × · AA texto grande ✓ · AAA texto grande ✓ | —

A matriz calcula a relação de contraste entre cada par de cores opacas e mostra os limites AA e AAA para texto comum e grande.

Aguardando a ferramenta. A explicação continua disponível sem JavaScript.

Método e limites

Digite de 2 a 20 cores HEX, uma por linha. Cada célula compara a cor da linha com a cor da coluna. Para texto comum, AA exige 4,5:1 e AAA 7:1; para texto grande, os limites são 3:1 e 4,5:1.

Aceita apenas cores HEX opacas de 3 ou 6 dígitos. Mostra os limites para texto comum e grande, mas não verifica o tamanho nem o peso real da fonte, os controles de interface, as imagens ou outros requisitos de acessibilidade.

✓ Processamento local✓ Sem cadastro✓ Entradas tratadas aqui✓ Gratuito

Em resumo

A matriz calcula a relação de contraste entre cada par de cores opacas e mostra os limites AA e AAA para texto comum e grande.

O código da página e seus recursos são carregados do site. Os dados digitados são processados no navegador, sem uma solicitação de cálculo.

Como usar

Digite de 2 a 20 cores HEX, uma por linha. Cada célula compara a cor da linha com a cor da coluna. Para texto comum, AA exige 4,5:1 e AAA 7:1; para texto grande, os limites são 3:1 e 4,5:1.

Limites

Perguntas frequentes

O que significa a relação de contraste?

É a relação entre as luminâncias relativas de duas cores. Um valor maior melhora o contraste do texto, mas não garante acessibilidade por si só.

A ferramenta detecta texto grande?

Não. A ferramenta mostra os limites AA e AAA para texto comum e grande. Use os resultados para texto grande somente quando o tamanho e o peso da fonte atenderem à definição de texto grande da WCAG.

Fontes e referências

As fontes documentam a norma ou API citada; elas não validam o resultado da ferramenta.