Sobre o Azul Aço
Azul Aço (steelblue) é um azul médio e moderadamente saturado, com código hex #4682b4, ou rgb(70, 130, 180). Em HSL, ele fica no matiz de 207°, com 44% de saturação e 49% de luminosidade. É uma das 148 cores nomeadas que todos os navegadores entendem, então você pode escrever color: steelblue; em vez do valor hex.
Usando Azul Aço em textos e fundos
| Combinação | Razão de contraste | WCAG |
|---|---|---|
| Texto Azul Aço sobre branco | 4.11 : 1 | AA apenas para texto grande |
| Texto Azul Aço sobre preto | 5.11 : 1 | AA |
Sobre um fundo azul aço, use texto em preto (5.11 : 1). O WCAG exige 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: steelblue; /* or #4682b4 */
background-color: #4682b4;
border: 1px solid rgb(70 130 180 / 50%);
}
Nomes de cores parecidas
Azul Cadete (#5f9ea0), Azul Royal (#4169e1), Cinza Ardósia (#708090), Cinza Ardósia Claro (#778899), Azul Ardósia (#6a5acd), Verde Mar Claro (#20b2aa).
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.