#216248#216248
#216248 is a dark, moderate teal. Relative luminance 0.095; OKLCH L 44.7% C 0.079 H 163.4°. Best body text is #FFFFFF at 7.23:1 contrast (WCAG AA passes).
Color values
| HEX | #216248 |
|---|---|
| RGB | rgb(33, 98, 72) |
| HSL | hsl(156, 50%, 26%) |
| HSV | hsv(156, 66%, 38%) |
| CMYK | cmyk(66.3%, 0%, 26.5%, 61.6%) |
| CIE-LAB | lab(36.98, -27.47, 8.84) |
| CIE-LCH | lch(36.98, 28.86, 162.17°) |
| OKLab | oklab(44.7% -0.0757 0.0226) |
| OKLCH | oklch(44.7% 0.079 163.4) |
| XYZ | xyz(6.1640, 9.5259, 7.6435) |
| Luminance | 0.0953 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Spruce
#0A5F38
ΔE00 4.51
Hunter Green
#355E3B
ΔE00 5.32
Dark Green Blue
#1F6357
ΔE00 5.55
Pine
#2B5D34
ΔE00 5.89
Dark Blue Green
#005249
ΔE00 8.35
Evergreen
#05472A
ΔE00 8.96
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#216248 #62213B
analogous
#216227 #216248 #215B62
triadic
#216248 #482162 #624821
tetradic
#216248 #272162 #62213B #5B6221
square
#216248 #272162 #62213B #5B6221
split-complementary
#216248 #62215B #622721
monochromatic
#081711 #123426 #216248 #30906A #40BE8B
Accessibility & contrast
On white
7.23
#216248 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.91
#216248 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #216248
7.23:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##216248 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##216248 | 1.00 | 7.23 | 2.91 | 7.23 |
| #FFFFFF | 7.23 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.91 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 7.23 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#605B47
Deuteranopia (green-blind)
#57544A
Tritanopia (blue-blind)
#00625B
Achromatopsia (no color)
#575757
Design tokens & code
CSS
--color: #216248; /* rgb */ color: rgb(33, 98, 72); /* oklch */ color: oklch(44.7% 0.079 163.4);
Tailwind
colors: {
custom: {
50: '#648f7b',
500: '#216248',
950: '#000000',
},
}SCSS
$custom: #216248; $custom-light: #648f7b; $custom-dark: #000000;
JSON
{
"hex": "#216248",
"rgb": {
"r": 33,
"g": 98,
"b": 72
},
"hsl": {
"h": 156,
"s": 49.618,
"l": 25.686
},
"oklch": {
"l": 0.44704,
"c": 0.07897,
"h": 163.4
},
"luminance": 0.09527
}Semantic roles & 50–950 ramp
primary
#216248
secondary
#964968
accent
#4F86D9
background
#F6F8F7
surface
#EBF0ED
border
#C6CBC8
text
#060C09
muted
#7A7D7B