Sobre a Mocassim
Mocassim (moccasin) é um laranja muito claro e vibrante, com o código hex #ffe4b5, ou rgb(255, 228, 181). Em HSL, fica com matiz de 38°, 100% de saturação e 85% de luminosidade. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: moccasin; em vez do valor hex.
Usando a Mocassim em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto mocassim no branco | 1.23 : 1 | reprovado |
| Texto mocassim no preto | 17.02 : 1 | AAA |
Em um fundo mocassim, use texto em preto (17.02 : 1). O 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: moccasin; /* or #ffe4b5 */
background-color: #ffe4b5;
border: 1px solid rgb(255 228 181 / 50%);
}
Cores nomeadas semelhantes
Branco Navajo (#ffdead), Pêssego Claro (#ffdab9), Trigo (#f5deb3), Bisque (#ffe4c4), Goldenrod Pálido (#eee8aa), Amêndoa Branqueada (#ffebcd).
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.