Verificador de contraste WCAG

O contraste WCAG mede a diferença de luminância entre texto e fundo como uma razão de 1:1 a 21:1. O nível AA exige pelo menos 4,5:1 para texto normal e 3:1 para texto grande. O nível AAA exige 7:1 e 4,5:1.

Atualizado em

Clique em um HEX para copiar · cadeado para fixar

Como usar

  1. Gere ou carregue uma paleta. A matriz cruza cada cor de fundo com todas as outras como cor de texto.
  2. Procure as células marcadas AA ou AAA para texto normal. AA18 serve apenas para texto grande.
  3. Use “Testar uma combinação” para ver um título e um parágrafo reais com o par escolhido.

Perguntas frequentes

O que conta como texto grande na WCAG?

Texto com pelo menos 18 pontos (cerca de 24 px), ou 14 pontos (cerca de 18,7 px) em negrito. Nesse tamanho, a WCAG 2.2 aceita contraste mínimo de 3:1 no nível AA.

Como a razão de contraste é calculada?

Soma-se 0,05 à luminância relativa de cada cor e divide-se o valor mais claro pelo mais escuro. O resultado vai de 1:1 (mesma cor) a 21:1 (preto sobre branco).

O contraste também vale para ícones e bordas?

Sim. O critério 1.4.11 da WCAG pede pelo menos 3:1 para componentes de interface e gráficos necessários para entender o conteúdo, como ícones, bordas de campos e linhas de gráficos.