#348291#348291
#348291 is a mid, moderate teal. Relative luminance 0.187; OKLCH L 56.5% C 0.079 H 212.4°. Best body text is #000000 at 4.75:1 contrast (WCAG AA passes).
Color values
| HEX | #348291 |
|---|---|
| RGB | rgb(52, 130, 145) |
| HSL | hsl(190, 47%, 39%) |
| HSV | hsv(190, 64%, 57%) |
| CMYK | cmyk(64.1%, 10.3%, 0%, 43.1%) |
| CIE-LAB | lab(50.38, -18.91, -15.16) |
| CIE-LCH | lch(50.38, 24.24, 218.73°) |
| OKLab | oklab(56.48% -0.0663 -0.0421) |
| OKLCH | oklch(56.48% 0.079 212.4) |
| XYZ | xyz(14.5075, 18.7381, 29.6348) |
| Luminance | 0.1874 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Teal Blue
#01889F
ΔE00 3.52
Ocean
#017B92
ΔE00 4.19
Dirty Blue
#3F829D
ΔE00 5.68
Deep Aqua
#08787F
ΔE00 6.46
Dark Cyan
#0A888A
ΔE00 7.26
Teal
#008080
ΔE00 8.06
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#348291 #914334
analogous
#349171 #348291 #345391
triadic
#348291 #913482 #829134
tetradic
#348291 #713491 #914334 #539134
square
#348291 #713491 #914334 #539134
split-complementary
#348291 #913453 #917134
monochromatic
#143137 #245A64 #348291 #46A9BD #73BECD
Accessibility & contrast
On white
4.42
#348291 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
4.75
#348291 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #348291
4.75:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##348291 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##348291 | 1.00 | 4.42 | 4.75 | 4.75 |
| #FFFFFF | 4.42 | 1.00 | 21.00 | 21.00 |
| #000000 | 4.75 | 21.00 | 1.00 | 1.00 |
| ##000000 | 4.75 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#767E92
Deuteranopia (green-blind)
#697491
Tritanopia (blue-blind)
#008887
Achromatopsia (no color)
#787878
Design tokens & code
CSS
--color: #348291; /* rgb */ color: rgb(52, 130, 145); /* oklch */ color: oklch(56.5% 0.079 212.4);
Tailwind
colors: {
custom: {
50: '#76a6b1',
500: '#348291',
950: '#000000',
},
}SCSS
$custom: #348291; $custom-light: #76a6b1; $custom-dark: #000000;
JSON
{
"hex": "#348291",
"rgb": {
"r": 52,
"g": 130,
"b": 145
},
"hsl": {
"h": 189.677,
"s": 47.208,
"l": 38.627
},
"oklch": {
"l": 0.56484,
"c": 0.07851,
"h": 212.4
},
"luminance": 0.1874
}Semantic roles & 50–950 ramp
primary
#348291
secondary
#B5786C
accent
#6751D7
background
#F7FAFA
surface
#EEF4F5
border
#C9CECF
text
#090F10
muted
#7B7F7F