Sobre o Vermelho
Vermelho (red) é um vermelho médio e vibrante, com o código hexadecimal #ff0000, ou rgb(255, 0, 0). Em HSL, ele fica no matiz de 0°, com saturação de 100% e luminosidade de 50%. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: red; em vez do valor hexadecimal.
Usando o vermelho em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto vermelho no branco | 4.00 : 1 | AA apenas para texto grande |
| Texto vermelho no preto | 5.25 : 1 | AA |
Em um fundo vermelho, use texto em preto (5.25 : 1). O WCAG exige no mínimo 4.5 : 1 para textos normais e 3 : 1 para textos grandes. Teste outros pares com o Verificador de Contraste.
CSS
.element {
color: red; /* or #ff0000 */
background-color: #ff0000;
border: 1px solid rgb(255 0 0 / 50%);
}Cores nomeadas semelhantes
Vermelho Alaranjado (#ff4500), Carmesim (#dc143c), Tijolo (#b22222), Marrom (#a52a2a), Vermelho Escuro (#8b0000), Chocolate (#d2691e).
Nomear Cores
Cole um código HEX para obter o nome mais próximo, legível para humanos, e nomes de tokens limpos para o seu CSS, SCSS, JavaScript ou configuração do Tailwind.