Sobre o Amarelo Claro
Amarelo Claro (lightyellow) é um amarelo bem claro e vibrante, com código hex #ffffe0, ou rgb(255, 255, 224). Em HSL ele fica com matiz de 60°, saturação de 100% e luminosidade de 94%. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: lightyellow; no lugar do valor hex.
Usando o Amarelo Claro em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto amarelo claro no branco | 1.02 : 1 | reprova |
| Texto amarelo claro no preto | 20.63 : 1 | AAA |
Em um fundo amarelo claro, use texto em preto (20.63 : 1). A WCAG pede no mínimo 4.5 : 1 para textos corridos e 3 : 1 para textos grandes. Confira outras combinações com o Verificador de Contraste.
CSS
.element {
color: lightyellow; /* or #ffffe0 */
background-color: #ffffe0;
border: 1px solid rgb(255 255 224 / 50%);
}
Cores nomeadas semelhantes
Seda de Milho (#fff8dc), Renda Antiga (#fdf5e6), Bege (#f5f5dc), Amarelo Goldenrod Claro (#fafad2), Marfim (#fffff0), Branco Floral (#fffaf0).
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.