Sobre o Gainsboro
Gainsboro (gainsboro) é um cinza muito claro e suave, com código hex #dcdcdc, ou rgb(220, 220, 220). No HSL ele fica com matiz de 0°, saturação de 0% e luminosidade de 86%. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: gainsboro; em vez do valor hex.
Usando o Gainsboro em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto gainsboro no branco | 1,37 : 1 | reprovado |
| Texto gainsboro no preto | 15,31 : 1 | AAA |
Em um fundo gainsboro, use texto em preto (15,31 : 1). A WCAG pede no mínimo 4,5 : 1 para textos corridos e 3 : 1 para textos grandes. Verifique outras combinações com o Verificador de Contraste.
CSS
.element {
color: gainsboro; /* or #dcdcdc */
background-color: #dcdcdc;
border: 1px solid rgb(220 220 220 / 50%);
}Cores nomeadas parecidas
Cinza Claro (#d3d3d3), Thistle (#d8bfd8), Lavanda (#e6e6fa), Branco Antigo (#faebd7), Bege (#f5f5dc), Rosa Enevoado (#ffe4e1).
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.