Verificador de Contraste WCAG
Verifique o rácio de contraste entre cores de texto e fundo segundo o WCAG 2.x. Veja instantaneamente se cumpre AA ou AAA para texto normal e grande.
Colores a comparar
Relación de contraste
Cumplimiento (WCAG 2.2)
Ejemplo de texto grande
Texto normal de cuerpo con 92% de brillo.
Como usar: Contraste
- 1Introduza a cor do texto e a do fundo.
- 2Escolha se o texto é normal ou grande.
- 3Consulte a relação de contraste e se cumpre WCAG AA e AAA.
Para que serve?
- Garantir que os textos do seu site são legíveis por todos.
- Rever botões e ligações antes de publicar um design.
- Cumprir requisitos de acessibilidade em projetos públicos.
Contraste de cor e acessibilidade (WCAG)
O que mede o rácio
O rácio compara a luminância relativa do texto e do fundo, de 1:1 a 21:1 (preto sobre branco). A fórmula WCAG pondera vermelho, verde e azul segundo a sensibilidade do olho humano.
Níveis AA e AAA
Para AA, o texto normal precisa de pelo menos 4,5:1 e o texto grande (24 px ou 18,66 px a negrito) de 3:1. O AAA exige 7:1 e 4,5:1. Componentes de interface, como contornos de campos, exigem 3:1.
Porque importa
O contraste insuficiente afeta pessoas com baixa visão ou daltonismo, mas também quem usa o telemóvel ao sol. Na Europa, a acessibilidade é obrigação legal para muitos serviços (EN 301 549). Nunca dependa só da cor para transmitir informação.
Ferramentas relacionadas
Artigos relacionados
Perguntas frequentes
Que rácio preciso para cumprir o WCAG?+
Texto normal precisa de 4,5:1 (AA) e 7:1 (AAA). Texto grande (≥18pt ou ≥14pt negrito) precisa de 3:1 (AA) e 4,5:1 (AAA).