Ferramenta Gratuita

Calculadora de Contraste de Cores WCAG

Verifique se a combinação de cores do seu website cumpre os requisitos de acessibilidade WCAG 2.1 para todos os utilizadores.

Selecione as Cores

Razão de Contraste

17.40:1

AA Normal
AA Large
AAA Normal
AAA Large

Pré-visualização

Este é um exemplo de texto normal (16px). Verifique se consegue ler confortavelmente este parágrafo. O contraste adequado é essencial para garantir que todos os utilizadores possam aceder ao seu conteúdo.

Este é texto grande (24px bold)

E este é texto de 18px regular

Elementos de Interface:

Link de texto

Dica: Use também a nossa Checklist de Acessibilidade WCAG para verificar outros critérios além do contraste de cores.

O que é WCAG?

WCAG (Web Content Accessibility Guidelines) são diretrizes internacionais para tornar o conteúdo web acessível a pessoas com deficiências.

O contraste de cores é um dos critérios mais importantes para garantir que o texto seja legível.

Requisitos de Contraste

WCAG AA (Mínimo)

  • • Texto normal: 4.5:1
  • • Texto grande (18pt+): 3:1

WCAG AAA (Melhorado)

  • • Texto normal: 7:1
  • • Texto grande (18pt+): 4.5:1

Obrigações Legais

Em Portugal, o Decreto-Lei 83/2018 obriga entidades públicas a cumprir WCAG 2.1 AA.

Empresas privadas também beneficiam de maior alcance e evitam riscos legais ao garantir acessibilidade.

Dicas Rápidas

  • Evite texto cinza claro em fundos brancos
  • Não dependa apenas da cor para transmitir informação
  • Teste com diferentes dispositivos e condições de luz

Precisa de validar isto no website inteiro?

Fazemos auditorias WCAG, priorizamos correções com impacto real e acompanhamos equipas públicas e privadas na implementação da acessibilidade.

Auditoria técnica e funcionalPrioridades por risco e esforçoApoio a equipas públicas e institucionais
Pedir Auditoria WCAGVer Serviço de Acessibilidade

Se o contraste falha em componentes críticos, normalmente há mais problemas de acessibilidade por resolver: foco, navegação por teclado, formulários e estrutura semântica.

Perguntas Frequentes

O que significa a razão de contraste?
A razão de contraste mede a diferença de luminosidade entre duas cores. Vai de 1:1 (sem contraste) a 21:1 (máximo contraste, preto sobre branco). Quanto maior, mais fácil de ler.
Qual a diferença entre AA e AAA?
AA é o nível mínimo exigido por lei para entidades públicas. AAA é o nível melhorado que oferece maior acessibilidade. Para a maioria dos sites, cumprir AA é suficiente, mas AAA é recomendado quando possível.
O que é considerado texto grande?
Texto grande é definido como 18pt (24px) ou 14pt (18.67px) a negrito. Texto grande tem requisitos de contraste mais baixos porque é naturalmente mais fácil de ler.
Logos e imagens decorativas precisam de contraste?
Não. Logotipos, texto em imagens puramente decorativas e elementos inativos estão isentos dos requisitos de contraste. Contudo, é boa prática manter boa legibilidade sempre que possível.

Ferramentas relacionadas

Combine a verificacao de contraste com outras ferramentas de acessibilidade e design.

Checklist Acessibilidade WCAGConversor WebPServico de Web DesignVer todas as ferramentas