Sobre a cor Tomate
Tomate (tomato) é um vermelho claro e vibrante, com o código hex #ff6347, ou rgb(255, 99, 71). No HSL, ela fica com matiz de 9°, saturação de 100% e luminosidade de 64%. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: tomato; em vez do valor hex.
Usando Tomate em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto tomate sobre branco | 2.95 : 1 | reprova |
| Texto tomate sobre preto | 7.13 : 1 | AAA |
Em um fundo tomate, use texto em preto (7.13 : 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: tomato; /* or #ff6347 */
background-color: #ff6347;
border: 1px solid rgb(255 99 71 / 50%);
}Cores nomeadas parecidas
Coral (#ff7f50), Salmão (#fa8072), Vermelho Indiano (#cd5c5c), Peru (#cd853f), Chocolate (#d2691e), Coral Claro (#f08080).
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.