Por que 83.9% dos sites falham no contraste de cores

A WebAIM audita todo ano o milhão de home pages mais visitadas. A pesquisa de 2026 encontrou falhas de contraste detectáveis em 83.9% delas, com uma média de 34 ocorrências de baixo contraste por página. No ano anterior, eram 79.1%.

O número está subindo. Essa é a parte interessante, porque verificar contraste não é um problema de ferramenta. O verificador da própria WebAIM é gratuito, é assim há anos, e todo designer sabe que ele existe.

Verificar não é o gargalo

Pergunte a designers o que os impede de corrigir uma falha de contraste e as respostas são impressionantemente parecidas:

“A maioria quer seguir as regras da WCAG, mas fica andando em círculos sem saber como corrigir problemas de contraste de cor.”

“Muita gente diz ‘escolha cores acessíveis’ sem ajudar de verdade a entender como, principalmente quando você precisa manter certas cores da marca.”

“A WCAG é intimidadora e confusa para a maioria. Ela diz o que precisa passar, mas não traz orientações sobre como fazer isso.”

Nenhuma dessas falas reclama da detecção. Todas tratam da etapa seguinte: saber o que mudar.

As ferramentas existentes respondem “isto passa?” e param por aí. É uma resposta completa para a pergunta errada. O designer já desconfiava que reprovava. Do que ele precisa é da cor mais próxima que funcione e ainda seja reconhecida como a da marca, e ele fica sozinho para encontrá-la, mexendo num valor hex até o número ficar verde.

Quatro motivos para piorar, e não melhorar

Cores da marca são restrições, não escolhas. A cor está no logotipo, na apresentação institucional e num manual de marca aprovado. “Escolha outra cor” não é um conselho que um designer possa seguir por conta própria. Então a falha fica.

O modo escuro dobrou a área a cobrir. Toda paleta agora precisa funcionar nos dois sentidos, e a fórmula da WCAG 2 é menos confiável justamente na ponta escura. Um tema que passa sobre branco e é invertido sem nova verificação é uma falha comum e invisível.

Os design systems espalham um único erro por toda parte. Um token com contraste insuficiente numa biblioteca de componentes se repete em todos os produtos que a usam. Os sistemas multiplicam força nos dois sentidos.

O contraste é verificado por último. Como disse um profissional da área, muitos designers “só ajustam o contraste perto do fim da fase de design, e só se for fácil fazer isso sem estragar o design”. A essa altura, a cor já sustenta o projeto, e mudá-la significa revisitar decisões que ninguém quer reabrir.

O que o número mede e o que não mede

Vale ser preciso. A pesquisa da WebAIM detecta falhas automaticamente, o que significa que ela pega casos de texto sobre fundo sólido e deixa passar outros: texto sobre imagens, texto sobre degradês e qualquer coisa que exija julgamento.

Então 83.9% é um piso, não um teto. O número real é maior.

Isso também não quer dizer que esses sites sejam inutilizáveis. Muitas falhas são marginais: um 4.2:1 que deveria ser 4.5:1. Elas importam, mas não são o mesmo que texto invisível.

A correção que realmente escala

Sites individuais são corrigidos um de cada vez. O padrão que move o número agregado é tornar fácil a escolha certa:

Coloque a restrição no token, não na revisão. Se o seu design system já entrega --text-brand num nível da escala que passa, ninguém precisa lembrar. A escala lembrou por todo mundo.

Teste o contraste na CI. Uma taxa reprovada deveria quebrar o build do mesmo jeito que um teste unitário reprovado. Fazemos isso no nosso próprio site: o build falha se algum dos nossos pares de cores deixar de passar na nossa própria ferramenta. Na primeira execução, ele pegou sete falhas reais, numa interface que passava na WCAG 2 em todos os pontos.

Verifique no tamanho e no peso que você publica. A WCAG 2 não enxerga a tipografia, então uma taxa aprovada numa legenda de 12px com traço fino não prova nada. O APCA modela isso, e o resultado incomoda: 14px regular não passa com contraste nenhum.

Dê às pessoas a resposta, não o veredito. Se uma ferramenta consegue calcular que o azul da sua marca precisa ficar 11% mais escuro para passar mantendo o matiz, ela deveria dizer isso, em vez de informar 3.02:1 e ir embora.

A lacuna que isso fecha

O motivo de termos construído nosso verificador de contraste do jeito que construímos é esse último ponto. O diagnóstico nunca foi a parte difícil.

Ele procura, no próprio eixo de luminosidade da sua cor, o valor mais próximo que passa, mantém o matiz para que o resultado continue parecendo a sua marca, ordena as opções pelo quanto a cor se desloca e sugere mudar o fundo quando essa for a concessão menor.

Você pode testá-lo com uma cor que disseram que você teria de abandonar.