#558267#558267
#558267 is a mid, moderate green. Relative luminance 0.189; OKLCH L 56.6% C 0.065 H 157.2°. Best body text is #000000 at 4.78:1 contrast (WCAG AA passes).
Color values
| HEX | #558267 |
|---|---|
| RGB | rgb(85, 130, 103) |
| HSL | hsl(144, 21%, 42%) |
| HSV | hsv(144, 35%, 51%) |
| CMYK | cmyk(34.6%, 0%, 20.8%, 49%) |
| CIE-LAB | lab(50.54, -21.65, 9.79) |
| CIE-LCH | lch(50.54, 23.76, 155.66°) |
| OKLab | oklab(56.59% -0.0599 0.0252) |
| OKLCH | oklch(56.59% 0.065 157.2) |
| XYZ | xyz(14.1763, 18.8751, 15.7256) |
| Luminance | 0.1888 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Slate Green
#658D6D
ΔE00 4.80
Dark Sage
#598556
ΔE00 6.01
Dark Sea Green
#11875D
ΔE00 8.09
Sea Green
#2E8B57
ΔE00 8.33
Green Grey
#77926F
ΔE00 8.67
Viridian
#1E9167
ΔE00 8.70
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#558267 #825570
analogous
#5A8255 #558267 #55827E
triadic
#558267 #675582 #826755
tetradic
#558267 #555A82 #825570 #827E55
square
#558267 #555A82 #825570 #827E55
split-complementary
#558267 #7E5582 #82555A
monochromatic
#25382C #3D5D4A #558267 #72A385 #97BBA5
Accessibility & contrast
On white
4.40
#558267 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
4.78
#558267 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #558267
4.78:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##558267 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##558267 | 1.00 | 4.40 | 4.78 | 4.78 |
| #FFFFFF | 4.40 | 1.00 | 21.00 | 21.00 |
| #000000 | 4.78 | 21.00 | 1.00 | 1.00 |
| ##000000 | 4.78 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#817B66
Deuteranopia (green-blind)
#7A7669
Tritanopia (blue-blind)
#4C817A
Achromatopsia (no color)
#787878
Design tokens & code
CSS
--color: #558267; /* rgb */ color: rgb(85, 130, 103); /* oklch */ color: oklch(56.6% 0.065 157.2);
Tailwind
colors: {
custom: {
50: '#86a692',
500: '#558267',
950: '#000000',
},
}SCSS
$custom: #558267; $custom-light: #86a692; $custom-dark: #000000;
JSON
{
"hex": "#558267",
"rgb": {
"r": 85,
"g": 130,
"b": 103
},
"hsl": {
"h": 144,
"s": 20.93,
"l": 42.157
},
"oklch": {
"l": 0.56587,
"c": 0.06502,
"h": 157.2
},
"luminance": 0.18876
}Semantic roles & 50–950 ramp
primary
#558267
secondary
#A88B9C
accent
#6A9CBD
background
#F8FAF8
surface
#EFF4F0
border
#CACECB
text
#0B0F0D
muted
#7C7F7D