#20612A#20612A
#20612A is a dark, moderate green. Relative luminance 0.090; OKLCH L 43.7% C 0.109 H 146.2°. Best body text is #FFFFFF at 7.49:1 contrast (WCAG AA passes).
Color values
| HEX | #20612A |
|---|---|
| RGB | rgb(32, 97, 42) |
| HSL | hsl(129, 50%, 25%) |
| HSV | hsv(129, 67%, 38%) |
| CMYK | cmyk(67%, 0%, 56.7%, 62%) |
| CIE-LAB | lab(36.03, -33.39, 25.20) |
| CIE-LCH | lch(36.03, 41.83, 142.95°) |
| OKLab | oklab(43.73% -0.0902 0.0605) |
| OKLCH | oklch(43.73% 0.109 146.2) |
| XYZ | xyz(5.2879, 9.0231, 3.6530) |
| Luminance | 0.0902 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Forest Green
#2D5A27
ΔE00 3.25
Pine
#2B5D34
ΔE00 3.63
Deep Green
#02590F
ΔE00 4.65
Spruce
#0A5F38
ΔE00 4.84
Hunter Green
#355E3B
ΔE00 5.61
Forest
#0B5509
ΔE00 5.62
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#20612A #612057
analogous
#366120 #20612A #20614A
triadic
#20612A #2A2061 #612A20
tetradic
#20612A #203661 #612057 #614A20
square
#20612A #203661 #612057 #614A20
split-complementary
#20612A #4A2061 #612036
monochromatic
#08170A #113316 #20612A #2F8F3E #3EBD52
Accessibility & contrast
On white
7.49
#20612A on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.80
#20612A on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #20612A
7.49:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##20612A | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##20612A | 1.00 | 7.49 | 2.80 | 7.49 |
| #FFFFFF | 7.49 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.80 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 7.49 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#625825
Deuteranopia (green-blind)
#5A532E
Tritanopia (blue-blind)
#0F5F55
Achromatopsia (no color)
#555555
Design tokens & code
CSS
--color: #20612a; /* rgb */ color: rgb(32, 97, 42); /* oklch */ color: oklch(43.7% 0.109 146.2);
Tailwind
colors: {
custom: {
50: '#648f65',
500: '#20612a',
950: '#000000',
},
}SCSS
$custom: #20612a; $custom-light: #648f65; $custom-dark: #000000;
JSON
{
"hex": "#20612a",
"rgb": {
"r": 32,
"g": 97,
"b": 42
},
"hsl": {
"h": 129.231,
"s": 50.388,
"l": 25.294
},
"oklch": {
"l": 0.4373,
"c": 0.10864,
"h": 146.2
},
"luminance": 0.09024
}Semantic roles & 50–950 ramp
primary
#20612A
secondary
#954789
accent
#4EC4DA
background
#F6F8F6
surface
#EBF0EB
border
#C6CBC6
text
#060C05
muted
#7A7D7A