Sobre o Índigo
Índigo (indigo) é um roxo escuro e vibrante, com o código hex #4b0082, ou rgb(75, 0, 130). Em HSL ele tem matiz de 275°, saturação de 100% e luminosidade de 25%. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: indigo; no lugar do valor hex.
Usando o Índigo em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto índigo no branco | 12.95 : 1 | AAA |
| Texto índigo no preto | 1.62 : 1 | reprovado |
Sobre um fundo índigo, use texto branco (12.95 : 1). A WCAG exige pelo menos 4.5 : 1 para textos corridos e 3 : 1 para textos grandes. Teste outras combinações com o Verificador de Contraste.
CSS
.element {
color: indigo; /* or #4b0082 */
background-color: #4b0082;
border: 1px solid rgb(75 0 130 / 50%);
}Nomes de cores semelhantes
Roxo (#800080), Azul Meia-Noite (#191970), Azul Ardósia Escuro (#483d8b), Rebecca Purple (#663399), Magenta Escuro (#8b008b), Azul-marinho (#000080).
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.