The Quick Brown Fox
Jumps over the lazy dog. Este exemplo mostra como sua combinação de cores fica em diferentes tamanhos.
Texto pequeno — legenda de 11px
Verificador de Contraste de Cores (WCAG 2.1)
O que esta ferramenta faz
Insira uma cor de primeiro plano (texto) e uma cor de fundo em formato HEX, ou use os seletores de cor. A ferramenta calcula instantaneamente a taxa de contraste WCAG 2.1 e verifica cinco níveis de conformidade: AA Normal, AA Grande, AA Componentes UI, AAA Normal e AAA Grande. A prévia ao vivo mostra como o texto fica com essas cores.
Como usar
- Defina a cor do texto usando o seletor ou digitando um valor HEX.
- Defina a cor de fundo da mesma forma.
- Leia a taxa de contraste e veja quais níveis WCAG passam ou falham.
- Use Trocar para inverter as cores.
Perguntas Frequentes
O que é razão de contraste?
A razão de contraste mede a diferença de luminância relativa entre duas cores. Vai de 1:1 (cores idênticas, sem contraste) a 21:1 (preto no branco, contraste máximo). Quanto maior a razão, mais fácil ler o texto.
O que significa WCAG?
WCAG significa Web Content Accessibility Guidelines (Diretrizes de Acessibilidade para Conteúdo Web). Publicadas pelo W3C, definem razões mínimas de contraste para que pessoas com baixa visão ou daltonismo consigam ler o conteúdo.
Qual a diferença entre conformidade AA e AAA?
O nível AA exige 4,5:1 para texto normal e 3:1 para texto grande, o mínimo que a maioria dos sites deve atender. O nível AAA exige 7:1 para texto normal e 4,5:1 para texto grande, e é recomendado para o corpo de texto em sites com muito conteúdo.
O que conta como texto grande na WCAG?
Texto grande é aquele com pelo menos 18pt (24px) em peso normal, ou pelo menos 14pt (cerca de 18,67px) em negrito. Texto nesse tamanho tem exigência de contraste menor, porque o tamanho já ajuda a leitura.
A ferramenta verifica contraste em imagens ou gráficos?
A ferramenta verifica o contraste entre duas cores sólidas: a do texto e a do fundo. Para texto sobre imagem, colete as áreas mais clara e mais escura do fundo e verifique o pior caso.