#4BCBB1#4BCBB1
#4BCBB1 is a light, moderate teal. Relative luminance 0.474; OKLCH L 76.5% C 0.118 H 177.0°. Best body text is #000000 at 10.48:1 contrast (WCAG AA passes).
Color values
| HEX | #4BCBB1 |
|---|---|
| RGB | rgb(75, 203, 177) |
| HSL | hsl(168, 55%, 55%) |
| HSV | hsv(168, 63%, 80%) |
| CMYK | cmyk(63.1%, 0%, 12.8%, 20.4%) |
| CIE-LAB | lab(74.43, -41.27, 2.61) |
| CIE-LCH | lch(74.43, 41.35, 176.37°) |
| OKLab | oklab(76.47% -0.1183 0.0063) |
| OKLCH | oklch(76.47% 0.118 177) |
| XYZ | xyz(32.1896, 47.3786, 49.0350) |
| Luminance | 0.4738 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Turquoise (survey)
#06C2AC
ΔE00 3.70
Mediumaquamarine
#66CDAA
ΔE00 3.84
Seafoam Blue
#78D1B6
ΔE00 4.38
Aquamarine (survey)
#04D8B2
ΔE00 4.65
Tealish
#24BCA8
ΔE00 4.69
Pale Teal
#82CBB2
ΔE00 5.77
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#4BCBB1 #CB4B65
analogous
#4BCB71 #4BCBB1 #4BA5CB
triadic
#4BCBB1 #B14BCB #CBB14B
tetradic
#4BCBB1 #714BCB #CB4B65 #A5CB4B
square
#4BCBB1 #714BCB #CB4B65 #A5CB4B
split-complementary
#4BCBB1 #CB4BA5 #CB714B
monochromatic
#237967 #31A890 #4BCBB1 #7AD9C6 #AAE6DA
Accessibility & contrast
On white
2.00
#4BCBB1 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.48
#4BCBB1 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #4BCBB1
10.48:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##4BCBB1 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##4BCBB1 | 1.00 | 2.00 | 10.48 | 10.48 |
| #FFFFFF | 2.00 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.48 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.48 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C4BFB0
Deuteranopia (green-blind)
#B1B1B3
Tritanopia (blue-blind)
#00CEC3
Achromatopsia (no color)
#B7B7B7
Design tokens & code
CSS
--color: #4bcbb1; /* rgb */ color: rgb(75, 203, 177); /* oklch */ color: oklch(76.5% 0.118 177.0);
Tailwind
colors: {
custom: {
50: '#8bdbc8',
500: '#4bcbb1',
950: '#000000',
},
}SCSS
$custom: #4bcbb1; $custom-light: #8bdbc8; $custom-dark: #000000;
JSON
{
"hex": "#4bcbb1",
"rgb": {
"r": 75,
"g": 203,
"b": 177
},
"hsl": {
"h": 167.813,
"s": 55.172,
"l": 54.51
},
"oklch": {
"l": 0.76467,
"c": 0.11845,
"h": 177
},
"luminance": 0.47382
}Semantic roles & 50–950 ramp
primary
#4BCBB1
secondary
#D49EA9
accent
#4968DF
background
#F9FDFC
surface
#F1FBF8
border
#CBD4D1
text
#0D1513
muted
#7E8382