#4DDFB3#4DDFB3
#4DDFB3 is a light, vivid teal. Relative luminance 0.576; OKLCH L 81.5% C 0.139 H 169.1°. Best body text is #000000 at 12.52:1 contrast (WCAG AA passes).
Color values
| HEX | #4DDFB3 |
|---|---|
| RGB | rgb(77, 223, 179) |
| HSL | hsl(162, 70%, 59%) |
| HSV | hsv(162, 65%, 87%) |
| CMYK | cmyk(65.5%, 0%, 19.7%, 12.5%) |
| CIE-LAB | lab(80.52, -49.04, 10.30) |
| CIE-LCH | lch(80.52, 50.11, 168.14°) |
| OKLab | oklab(81.46% -0.1369 0.0263) |
| OKLCH | oklch(81.46% 0.139 169.1) |
| XYZ | xyz(37.5808, 57.6037, 51.7771) |
| Luminance | 0.5761 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Eucalyptus
#44D7A8
ΔE00 2.18
Aqua Marine
#2EE8BB
ΔE00 2.48
Aquamarine (survey)
#04D8B2
ΔE00 3.35
Seafoam
#7FE0B3
ΔE00 4.46
Aqua (survey)
#13EAC9
ΔE00 4.89
Mediumaquamarine
#66CDAA
ΔE00 4.98
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#4DDFB3 #DF4D79
analogous
#4DDF6A #4DDFB3 #4DC2DF
triadic
#4DDFB3 #B34DDF #DFB34D
tetradic
#4DDFB3 #6A4DDF #DF4D79 #C2DF4D
square
#4DDFB3 #6A4DDF #DF4D79 #C2DF4D
split-complementary
#4DDFB3 #DF4DC2 #DF6A4D
monochromatic
#1B9771 #24CA98 #4DDFB3 #81E8C9 #B5F2DF
Accessibility & contrast
On white
1.68
#4DDFB3 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.52
#4DDFB3 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #4DDFB3
12.52:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##4DDFB3 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##4DDFB3 | 1.00 | 1.68 | 12.52 | 12.52 |
| #FFFFFF | 1.68 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.52 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.52 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#D9D0B1
Deuteranopia (green-blind)
#C5C2B6
Tritanopia (blue-blind)
#00E0D2
Achromatopsia (no color)
#C8C8C8
Design tokens & code
CSS
--color: #4ddfb3; /* rgb */ color: rgb(77, 223, 179); /* oklch */ color: oklch(81.5% 0.139 169.1);
Tailwind
colors: {
custom: {
50: '#8feac9',
500: '#4ddfb3',
950: '#000000',
},
}SCSS
$custom: #4ddfb3; $custom-light: #8feac9; $custom-dark: #000000;
JSON
{
"hex": "#4ddfb3",
"rgb": {
"r": 77,
"g": 223,
"b": 179
},
"hsl": {
"h": 161.918,
"s": 69.524,
"l": 58.824
},
"oklch": {
"l": 0.81463,
"c": 0.13942,
"h": 169.1
},
"luminance": 0.57608
}Semantic roles & 50–950 ramp
primary
#4DDFB3
secondary
#9B3554
accent
#3B71EC
background
#FCFEFD
surface
#F5FDF9
border
#CFD5D2
text
#0E1613
muted
#7F8482