Verificador de Contraste de Cores A11y
O contraste de cores é um aspecto essencial da acessibilidade em seu aplicativo. Selecionar uma cor de primeiro plano e de fundo com contraste grande o suficiente garantirá que seu aplicativo seja legível para todos os usuários. Quanto mais cedo você entender as especificações de contraste de cores, melhores decisões você tomará, não apenas em termos de seus aplicativos da web, mas também de sua marca como um todo.
Nota
0:1O WCAG define dois níveis para contraste de cores: nível AA (o nível mínimo necessário para um contraste válido) e nível AAA (o nível aprimorado e melhor nível de acessibilidade). Há também 3 tipos de conteúdo (texto de corpo, texto em grande escala e objetos gráficos e componentes da interface do usuário) para os quais as diretrizes do WCAG definiram notas de contraste específicas. Idealmente, devemos sempre ter como objetivo ter pelo menos um nível AA em todos os três tipos de conteúdo. Também é importante observar que não há nível AAA para o último tipo de conteúdo (objetos gráficos e componentes ativos da interface do usuário).
Tipo de conteúdo | Nota mínima (nível AA) | Nota aprimorado (nível AAA) |
---|---|---|
Texto de corpo | 4.5 : 1 | 7 : 1 |
Texto em grande escala | 3 : 1 | 4.5 : 1 |
Objetos gráficos e componentes da interface do usuário | 3 : 1 |
Texto de corpo
The quick brown fox jumped over the...
Texto em grande escala
The quick brown fox jumped over the...