#286C3E#286C3E
#286C3E is a mid, moderate green. Relative luminance 0.115; OKLCH L 47.5% C 0.101 H 151.2°. Best body text is #FFFFFF at 6.35:1 contrast (WCAG AA passes).
Color values
| HEX | #286C3E |
|---|---|
| RGB | rgb(40, 108, 62) |
| HSL | hsl(139, 46%, 29%) |
| HSV | hsv(139, 63%, 42%) |
| CMYK | cmyk(63%, 0%, 42.6%, 57.6%) |
| CIE-LAB | lab(40.45, -32.67, 19.54) |
| CIE-LCH | lch(40.45, 38.07, 149.12°) |
| OKLab | oklab(47.54% -0.0884 0.0485) |
| OKLCH | oklch(47.54% 0.101 151.2) |
| XYZ | xyz(7.1066, 11.5234, 6.4062) |
| Luminance | 0.1152 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Spruce
#0A5F38
ΔE00 5.06
Pine
#2B5D34
ΔE00 5.14
Hunter Green
#355E3B
ΔE00 5.78
Darkish Green
#287C37
ΔE00 6.87
Forest Green
#2D5A27
ΔE00 6.90
Jungle Green
#048243
ΔE00 8.07
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#286C3E #6C2856
analogous
#346C28 #286C3E #286C60
triadic
#286C3E #3E286C #6C3E28
tetradic
#286C3E #28346C #6C2856 #6C6028
square
#286C3E #28346C #6C2856 #6C6028
split-complementary
#286C3E #60286C #6C2834
monochromatic
#08160D #173F24 #286C3E #399958 #50BE74
Accessibility & contrast
On white
6.35
#286C3E on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.30
#286C3E on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #286C3E
6.35:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##286C3E | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##286C3E | 1.00 | 6.35 | 3.30 | 6.35 |
| #FFFFFF | 6.35 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.30 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.35 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#6C633B
Deuteranopia (green-blind)
#635D41
Tritanopia (blue-blind)
#136A61
Achromatopsia (no color)
#5F5F5F
Design tokens & code
CSS
--color: #286c3e; /* rgb */ color: rgb(40, 108, 62); /* oklch */ color: oklch(47.5% 0.101 151.2);
Tailwind
colors: {
custom: {
50: '#699774',
500: '#286c3e',
950: '#000000',
},
}SCSS
$custom: #286c3e; $custom-light: #699774; $custom-dark: #000000;
JSON
{
"hex": "#286c3e",
"rgb": {
"r": 40,
"g": 108,
"b": 62
},
"hsl": {
"h": 139.412,
"s": 45.946,
"l": 29.02
},
"oklch": {
"l": 0.47543,
"c": 0.10081,
"h": 151.2
},
"luminance": 0.11524
}Semantic roles & 50–950 ramp
primary
#286C3E
secondary
#9E5186
accent
#52ABD6
background
#F6F9F7
surface
#EBF2ED
border
#C6CCC8
text
#070D08
muted
#7A7E7B