#218793#218793
#218793 is a mid, moderate teal. Relative luminance 0.198; OKLCH L 57.3% C 0.090 H 206.9°. Best body text is #000000 at 4.95:1 contrast (WCAG AA passes).
Color values
| HEX | #218793 |
|---|---|
| RGB | rgb(33, 135, 147) |
| HSL | hsl(186, 63%, 35%) |
| HSV | hsv(186, 78%, 58%) |
| CMYK | cmyk(77.6%, 8.2%, 0%, 42.4%) |
| CIE-LAB | lab(51.56, -23.70, -14.58) |
| CIE-LCH | lch(51.56, 27.83, 211.60°) |
| OKLab | oklab(57.33% -0.0801 -0.0406) |
| OKLCH | oklch(57.33% 0.09 206.9) |
| XYZ | xyz(14.5553, 19.7561, 30.6443) |
| Luminance | 0.1976 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Teal Blue
#01889F
ΔE00 3.91
Dark Cyan
#0A888A
ΔE00 4.63
Darkcyan
#008B8B
ΔE00 5.67
Ocean
#017B92
ΔE00 6.17
Deep Aqua
#08787F
ΔE00 6.20
Teal
#008080
ΔE00 6.26
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#218793 #932D21
analogous
#219366 #218793 #214E93
triadic
#218793 #932187 #879321
tetradic
#218793 #662193 #932D21 #4E9321
square
#218793 #662193 #932D21 #4E9321
split-complementary
#218793 #93214E #936621
monochromatic
#0B2B2F #165961 #218793 #2CB5C5 #55CBD9
Accessibility & contrast
On white
4.24
#218793 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
4.95
#218793 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #218793
4.95:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##218793 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##218793 | 1.00 | 4.24 | 4.95 | 4.95 |
| #FFFFFF | 4.24 | 1.00 | 21.00 | 21.00 |
| #000000 | 4.95 | 21.00 | 1.00 | 1.00 |
| ##000000 | 4.95 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7B8194
Deuteranopia (green-blind)
#6B7693
Tritanopia (blue-blind)
#008D8B
Achromatopsia (no color)
#7B7B7B
Design tokens & code
CSS
--color: #218793; /* rgb */ color: rgb(33, 135, 147); /* oklch */ color: oklch(57.3% 0.090 206.9);
Tailwind
colors: {
custom: {
50: '#70aab2',
500: '#218793',
950: '#000000',
},
}SCSS
$custom: #218793; $custom-light: #70aab2; $custom-dark: #000000;
JSON
{
"hex": "#218793",
"rgb": {
"r": 33,
"g": 135,
"b": 147
},
"hsl": {
"h": 186.316,
"s": 63.333,
"l": 35.294
},
"oklch": {
"l": 0.57325,
"c": 0.08975,
"h": 206.9
},
"luminance": 0.19758
}Semantic roles & 50–950 ramp
primary
#218793
secondary
#BD5E53
accent
#5341E6
background
#F7FAFA
surface
#EDF4F5
border
#C8CECF
text
#091011
muted
#7B7F80