Sobre a cor Violeta
Violeta (violet) é um magenta claro e vibrante, com código hex #ee82ee, ou rgb(238, 130, 238). Em HSL, fica no matiz de 300°, com 76% de saturação e 72% de luminosidade. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: violet; no lugar do valor hex.
Usando Violeta em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto violeta no branco | 2.32 : 1 | reprova |
| Texto violeta no preto | 9.06 : 1 | AAA |
Em um fundo violeta, use texto em preto (9.06 : 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: violet; /* or #ee82ee */
background-color: #ee82ee;
border: 1px solid rgb(238 130 238 / 50%);
}
Nomes de cores semelhantes
Orquídea (#da70d6), Ameixa (#dda0dd), Rosa Choque (#ff69b4), Cardo (#d8bfd8), Rosa Claro (#ffb6c1), Rosa (#ffc0cb).
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.