#218F53#218F53
#218F53 is a mid, vivid green. Relative luminance 0.206; OKLCH L 57.5% C 0.133 H 154.0°. Best body text is #000000 at 5.12:1 contrast (WCAG AA passes).
Color values
| HEX | #218F53 |
|---|---|
| RGB | rgb(33, 143, 83) |
| HSL | hsl(147, 63%, 35%) |
| HSV | hsv(147, 77%, 56%) |
| CMYK | cmyk(76.9%, 0%, 42%, 43.9%) |
| CIE-LAB | lab(52.50, -44.35, 23.50) |
| CIE-LCH | lch(52.50, 50.19, 152.08°) |
| OKLab | oklab(57.54% -0.1195 0.0584) |
| OKLCH | oklch(57.54% 0.133 154) |
| XYZ | xyz(12.0099, 20.5914, 11.5235) |
| Luminance | 0.2059 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Sea Green
#2E8B57
ΔE00 2.11
Viridian
#1E9167
ΔE00 4.72
Light Forest Green
#4F9153
ΔE00 4.91
Jungle Green
#048243
ΔE00 5.09
Dark Sea Green
#11875D
ΔE00 5.11
Kelley Green
#009337
ΔE00 5.69
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#218F53 #8F215D
analogous
#268F21 #218F53 #218F8A
triadic
#218F53 #53218F #8F5321
tetradic
#218F53 #21268F #8F215D #8F8A21
square
#218F53 #21268F #8F215D #8F8A21
split-complementary
#218F53 #8A218F #8F2126
monochromatic
#0A2C19 #165D36 #218F53 #2CC170 #53D78F
Accessibility & contrast
On white
4.10
#218F53 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.12
#218F53 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #218F53
5.12:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##218F53 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##218F53 | 1.00 | 4.10 | 5.12 | 5.12 |
| #FFFFFF | 4.10 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.12 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.12 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#8F834F
Deuteranopia (green-blind)
#827A57
Tritanopia (blue-blind)
#008D80
Achromatopsia (no color)
#7D7D7D
Design tokens & code
CSS
--color: #218f53; /* rgb */ color: rgb(33, 143, 83); /* oklch */ color: oklch(57.5% 0.133 154.0);
Tailwind
colors: {
custom: {
50: '#6eb184',
500: '#218f53',
950: '#000000',
},
}SCSS
$custom: #218f53; $custom-light: #6eb184; $custom-dark: #000000;
JSON
{
"hex": "#218f53",
"rgb": {
"r": 33,
"g": 143,
"b": 83
},
"hsl": {
"h": 147.273,
"s": 62.5,
"l": 34.51
},
"oklch": {
"l": 0.57542,
"c": 0.13298,
"h": 154
},
"luminance": 0.20593
}Semantic roles & 50–950 ramp
primary
#218F53
secondary
#BB518B
accent
#429BE6
background
#F7FBF8
surface
#EDF6EF
border
#C8D0CA
text
#08110B
muted
#7B807C