Cor nomeada do CSS
Cor OliveDrab #6B8E23
OliveDrab (palavra-chave olivedrab no CSS) tem o código hex #6B8E23 e o valor RGB rgb(107, 142, 35): um verde-amarelado moderadamente saturado e médio.
O nome vem do verde-oliva (olive drab) de uniformes e equipamentos militares, embora o valor do CSS (#6b8e23) seja um verde-amarelado mais claro que a maioria das especificações militares.
Códigos da cor OliveDrab
| Palavra-chave CSS | olivedrab |
|---|---|
| HEX | #6B8E23 |
| RGB | rgb(107, 142, 35) |
| HSL | hsl(80, 60%, 35%) |
| HWB | hwb(80 14% 44%) |
| OKLCH | oklch(59.9% 0.137 126.3) |
| CMYK (simples, sem perfil ICC) | cmyk(25%, 0%, 75%, 44%) |
| Decimal | 7.048.739 |
| Família de matiz | Verdes |
Contraste e acessibilidade
Sobre olivedrab, texto preto tem contraste de 5,51:1 e passa no AA para texto normal; texto branco fica em 3,80:1.
Razões de contraste do WCAG 2.2 (critérios 1.4.3 e 1.4.6: AA exige 4,5:1 para texto normal e 3:1 para texto grande; AAA exige 7:1 e 4,5:1). APCA Lc é o contraste de luminosidade do modelo APCA-W3 0.0.98G proposto para o WCAG 3; quanto maior o valor absoluto, mais legível, e Lc 75 é o mínimo sugerido para texto corrido.
| Combinação | Razão | AA | AA grande | AAA | AAA grande | APCA Lc |
|---|---|---|---|---|---|---|
| Texto preto sobre olivedrab | 5,51:1 | Passa | Passa | Falha | Passa | 38,7 |
| Texto branco sobre olivedrab | 3,80:1 | Falha | Passa | Falha | Falha | −70,9 |
| Texto olivedrab sobre branco | 3,80:1 | Falha | Passa | Falha | Falha | 65,4 |
| Texto olivedrab sobre preto | 5,51:1 | Passa | Passa | Falha | Passa | −36,2 |
Tons claros e escuros
Cada passo mistura olivedrab com branco (tons claros) ou preto (tons escuros) em sRGB com correção gama, o mesmo resultado de color-mix(in srgb, olivedrab, white 25%) no CSS.
Tons claros (misturados com branco)
- 5%
#72942e - 15%
#819f44 - 25%
#90aa5a - 35%
#9fb670 - 45%
#aec186 - 55%
#bccc9c - 65%
#cbd7b2 - 75%
#dae3c8 - 85%
#e9eede - 95%
#f8f9f4
Tons escuros (misturados com preto)
- 5%
#668721 - 15%
#5b791e - 25%
#506b1a - 35%
#465c17 - 45%
#3b4e13 - 55%
#304010 - 65%
#25320c - 75%
#1b2409 - 85%
#101505 - 95%
#050702
Harmonias de cor
Girando o matiz em OKLCH e mantendo luminosidade e croma, a complementar de olivedrab é #9568C0 (perto de mediumpurple), as análogas são #987E00 e #1A985D e a tríade se completa com #2886CD e #C25873. Para texto por cima, preto dá mais contraste.
| Harmonia | Rotação | Cor |
|---|---|---|
| Complementar | +180° | #9568c0 |
| Análogas | −30°, +30° | #987e00#1a985d |
| Tríade | +120°, +240° | #2886cd#c25873 |
| Complementar dividida | +150°, +210° | #6b76d1#b25d9f |
Calculadas em OKLCH: o matiz gira 180° (complementar), ±30° (análogas), ±120° (tríade) e 180° ±30° (complementar dividida), com luminosidade e croma mantidos. Quando o resultado sai do sRGB, ele é trazido de volta com o algoritmo de mapeamento de gama do CSS Color 4. Por usar OKLCH, os valores diferem das ferramentas que giram o matiz em HSL, mas as cores ficam com a mesma luminosidade percebida.
Quente ou fria?
OliveDrab fica na fronteira: o matiz de 80° no círculo HSL é um verde-amarelado, que parece quente ao lado de azuis e frio ao lado de vermelhos e laranjas.
Cores nomeadas e do Tailwind mais próximas
A distância é o ΔE OK, a distância euclidiana no OKLab multiplicada por 100. Valores abaixo de cerca de 2 são difíceis de distinguir lado a lado.
Cores nomeadas do CSS mais próximas
| Cor | HEX | ΔE OK |
|---|---|---|
| olive | #808000 | 4,4 |
| forestgreen | #228b22 | 6,8 |
| seagreen | #2e8b57 | 7,3 |
Cores do Tailwind v4 mais próximas
| Cor | HEX | ΔE OK |
|---|---|---|
| lime-700 | #497d00 | 7,2 |
| lime-600 | #5ea500 | 8,1 |
| emerald-600 | #009966 | 9,0 |
Código
.element {
color: olivedrab;
background-color: #6b8e23;
border-color: rgb(107 142 35);
outline-color: oklch(59.9% 0.137 126.3);
}<div class="bg-[#6b8e23] text-black">...</div>
/* ou registre uma vez no seu CSS (Tailwind v4) */
@theme {
--color-olivedrab: #6b8e23;
}
/* depois use bg-olivedrab, text-olivedrab, border-olivedrab */import SwiftUI
extension Color {
static let olivedrab = Color(red: 0.420, green: 0.557, blue: 0.137)
}import androidx.compose.ui.graphics.Color
val Olivedrab = Color(0xFF6B8E23)import 'package:flutter/material.dart';
const olivedrab = Color(0xFF6B8E23);<!-- res/values/colors.xml -->
<color name="olivedrab">#6B8E23</color>Perguntas frequentes
- Qual é o código hex da cor olivedrab?
- O código hex de olivedrab é #6B8E23. A mesma cor se escreve rgb(107, 142, 35), hsl(80, 60%, 35%) ou oklch(59.9% 0.137 126.3), e no CSS também dá para usar direto a palavra-chave olivedrab.
- OliveDrab é uma cor quente ou fria?
- OliveDrab fica na fronteira: o matiz de 80° no círculo HSL é um verde-amarelado, que parece quente ao lado de azuis e frio ao lado de vermelhos e laranjas.
- Quais cores combinam com olivedrab?
- Girando o matiz em OKLCH e mantendo luminosidade e croma, a complementar de olivedrab é #9568C0 (perto de mediumpurple), as análogas são #987E00 e #1A985D e a tríade se completa com #2886CD e #C25873. Para texto por cima, preto dá mais contraste.
- Dá para usar texto branco sobre olivedrab?
- Texto branco sobre olivedrab tem contraste de 3,80:1 e passa no AA só para texto grande (a partir de 24 px, ou 18,66 px em negrito) do WCAG 2.2. Texto preto chega a 5,51:1 e passa no AA para texto normal, mas não no AAA. No APCA, o valor é Lc −70,9 para branco e Lc 38,7 para preto.
- Qual é o RGB de olivedrab?
- OliveDrab é rgb(107, 142, 35): vermelho 107, verde 142 e azul 35 na escala de 0 a 255, ou 42,0%, 55,7% e 13,7%. Em número decimal, 7048739.
Revisado em por Arielton Oberek.