Sobre o Marrom
Marrom (brown) é um vermelho médio, com saturação moderada, de código hex #a52a2a, ou rgb(165, 42, 42). No HSL, fica em matiz de 0°, 59% de saturação e 41% de luminosidade. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: brown; em vez do valor hex.
Usando o Marrom em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto marrom no branco | 7.08 : 1 | AAA |
| Texto marrom no preto | 2.96 : 1 | reprovado |
Em um fundo marrom, use texto em branco (7.08 : 1). O WCAG exige no mínimo 4.5 : 1 para textos corridos e 3 : 1 para textos grandes. Teste outras combinações com o Verificador de Contraste.
CSS
.element {
color: brown; /* or #a52a2a */
background-color: #a52a2a;
border: 1px solid rgb(165 42 42 / 50%);
}
Cores nomeadas semelhantes
Fire Brick (#b22222), Sienna (#a0522d), Saddle Brown (#8b4513), Crimson (#dc143c), Dark Red (#8b0000), Maroon (#800000).
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.