#148D9F#148D9F
#148D9F is a mid, moderate teal. Relative luminance 0.217; OKLCH L 59.2% C 0.099 H 211.1°. Best body text is #000000 at 5.34:1 contrast (WCAG AA passes).
Color values
| HEX | #148D9F |
|---|---|
| RGB | rgb(20, 141, 159) |
| HSL | hsl(188, 78%, 35%) |
| HSV | hsv(188, 87%, 62%) |
| CMYK | cmyk(87.4%, 11.3%, 0%, 37.6%) |
| CIE-LAB | lab(53.71, -23.99, -18.29) |
| CIE-LCH | lch(53.71, 30.16, 217.32°) |
| OKLab | oklab(59.15% -0.0848 -0.051) |
| OKLCH | oklch(59.15% 0.099 211.1) |
| XYZ | xyz(16.0686, 21.6996, 36.1357) |
| Luminance | 0.2170 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Teal Blue
#01889F
ΔE00 2.56
Dark Cyan
#0A888A
ΔE00 6.88
Ocean
#017B92
ΔE00 6.99
Dirty Blue
#3F829D
ΔE00 7.39
Darkcyan
#008B8B
ΔE00 7.56
Deep Aqua
#08787F
ΔE00 9.01
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#148D9F #9F2614
analogous
#149F6C #148D9F #14479F
triadic
#148D9F #9F148D #8D9F14
tetradic
#148D9F #6C149F #9F2614 #479F14
square
#148D9F #6C149F #9F2614 #479F14
split-complementary
#148D9F #9F1447 #9F6C14
monochromatic
#062D32 #0D5D69 #148D9F #1BBDD5 #46D3E8
Accessibility & contrast
On white
3.93
#148D9F on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.34
#148D9F on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #148D9F
5.34:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##148D9F | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##148D9F | 1.00 | 3.93 | 5.34 | 5.34 |
| #FFFFFF | 3.93 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.34 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.34 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7E88A0
Deuteranopia (green-blind)
#6D7B9F
Tritanopia (blue-blind)
#009592
Achromatopsia (no color)
#808080
Design tokens & code
CSS
--color: #148d9f; /* rgb */ color: rgb(20, 141, 159); /* oklch */ color: oklch(59.2% 0.099 211.1);
Tailwind
colors: {
custom: {
50: '#70aebb',
500: '#148d9f',
950: '#000000',
},
}SCSS
$custom: #148d9f; $custom-light: #70aebb; $custom-dark: #000000;
JSON
{
"hex": "#148d9f",
"rgb": {
"r": 20,
"g": 141,
"b": 159
},
"hsl": {
"h": 187.77,
"s": 77.654,
"l": 35.098
},
"oklch": {
"l": 0.5915,
"c": 0.09893,
"h": 211.1
},
"luminance": 0.21702
}Semantic roles & 50–950 ramp
primary
#148D9F
secondary
#C85746
accent
#4D34F4
background
#F7FAFB
surface
#EDF4F6
border
#C8CED0
text
#091011
muted
#7B7F80