Predefinição:Razão de contraste entre cores
Descrição[editar código-fonte]
Esta predefinição retorna a relação de contraste entre duas cores dadas. Ela aceita dois parâmetros, que podem ser um código de cor hexadecimal padrão (#RRGGBB
) ou uma cor HTML padrão ou CSS "orange" (= #FFA500
). Os nomes das cores e as letras hexadecimais não são sensíveis a maiúsculas e minúsculas (isto é, podem ser utilizadas tanto letras maiúsculas quanto minúsculas).
Uso[editar código-fonte]
Exemplos com um fundo claro[editar código-fonte]
Cor do texto |
Cor do fundo |
Exemplo | Código | Relação de contraste |
Conformidade com WCAG 2.0 |
---|---|---|---|---|---|
#000000 | #FFFFFF | Exemplo | {{Razão de contraste entre cores|#000000|#FFFFFF}}
|
21 | AAA |
#000080 | #DDDDDD | Exemplo | {{Razão de contraste entre cores|#000080|#DDDDDD}}
|
11.787 | AAA |
#7B0000 | #FF9900 | Exemplo | {{Razão de contraste entre cores|#7B0000|#FF9900}}
|
5.324 | AA |
#004800 | #AAAAAA | Exemplo | {{Razão de contraste entre cores|#004800|#AAAAAA}}
|
4.691 | AA |
red | white | Exemplo | {{Razão de contraste entre cores|red|white}}
|
3.998 | Não |
#FF0000 | #FF9999 | Exemplo | {{Razão de contraste entre cores|#FF0000|#FF9999}}
|
1.955 | Não |
Exemplos com fundo escuro[editar código-fonte]
Cor do texto |
Cor do fundo |
Exemplo | Código | Relação de contraste |
Recíproco | Conformidade com WCAG 2.0 |
---|---|---|---|---|---|---|
#BADFEE | black | Sample | {{Razão de contraste entre cores|#BaDFeE|BlAcK}}
|
14.878 | 14.878 | AAA |
red | black | Sample | {{Razão de contraste entre cores|red|black}}
|
5.252 | 5.252 | AA |
#FFFF00 | #00FFFF | Sample | {{Razão de contraste entre cores|#FFFF00|#00FFFF}}
|
1.168 | 1.168 | Não |
WCAG 2.0[editar código-fonte]
Para orientar a escolha de cores do texto e do fundo, as Diretrizes de Acessibilidade para o Conteúdo da Web 2.0 (orientação 1.4) classificam as relações de contraste para texto comum da seguinte forma:
Tamanho da fonte | Incompatível | Nível AA | Nível AAA |
---|---|---|---|
Normal | < 4.5 | 4.5 to 7.0 | > 7.0 |
Grande (18 pt ou 14 pt em negrito) | < 3.0 | 3.0 to 4.5 | > 4.5 |
O wikitexto normal é renderizado pelos navegadores comuns com cerca de 9.5 ou 10.5 pt (12.5 a 14 px), dependendo do skin. O tamanho da fonte precisaria ser de aproximadamente 180% ou 140% em negrito para ser considerado como "Grande" para efeito das WCAG.
Ver também[editar código-fonte]
- Wikipédia:Acessibilidade
- Verificação do contraste entre cores
- G18: Garantindo a existência de uma relação de contraste de no mínimo 4.5:1 entre o texto (e imagens de texto) e o fundo por detrás do texto
- Índice de exemplos de contraste entre cores, e em especial os exemplos com fundo branco
A documentação acima é transcluída de Predefinição:Razão de contraste entre cores/doc. (editar | histórico) Editores podem experimentar nas páginas de teste (criar | espelhar) e de exemplos para testes (criar) desta predefinição. Por favor adicione categorias à subpágina /doc. Subpáginas desta predefinição. |