Verificador de Contraste WCAG

A razão de contraste vem de uma fórmula da WCAG baseada na luminância relativa de cada cor, um valor que representa o brilho percebido. Para cada cor, os canais vermelho, verde e azul recebem uma correção gama e são somados com pesos diferentes, e o verde pesa mais porque o olho é mais sensível a ele. A razão é então (L1 mais 0,05) dividido por (L2 mais 0,05), em que L1 é a luminância da cor mais clara e L2 a da mais escura. O resultado vai de 1:1, quando as cores são iguais, até 21:1, o contraste máximo entre preto e branco puros.

O contraste suficiente garante que pessoas com baixa visão, daltonismo ou vista cansada consigam ler o texto, e por isso é um critério central de acessibilidade. Uma parcela grande da população tem alguma deficiência na visão de cores, e telas usadas sob sol forte ou com brilho baixo pioram a leitura de qualquer pessoa. As diretrizes WCAG existem para cobrir esses casos, e no Brasil a acessibilidade digital é orientada pelo eMAG em sites públicos e reforçada pela Lei Brasileira de Inclusão. Cuidar do contraste beneficia todos os usuários, não só quem tem alguma deficiência.

Quando uma combinação não passa, o caminho é aumentar a diferença de luminosidade entre texto e fundo, não apenas trocar o matiz. Escurecer o texto sobre fundo claro, ou clarear o texto sobre fundo escuro, costuma resolver mais rápido do que mudar a cor. Cuidado com duas cores vivas de brilho parecido, como vermelho sobre verde: elas podem ter contraste baixo mesmo parecendo bem diferentes. Aumentar o tamanho ou o peso da fonte também ajuda, porque texto grande exige razão menor, de 3:1 no nível AA. Ajuste os valores até a combinação atingir pelo menos 4,5:1 para texto normal.