#2DDFA6#2DDFA6
#2DDFA6 is a light, vivid teal. Relative luminance 0.561; OKLCH L 80.5% C 0.160 H 165.3°. Best body text is #000000 at 12.22:1 contrast (WCAG AA passes).
Color values
| HEX | #2DDFA6 |
|---|---|
| RGB | rgb(45, 223, 166) |
| HSL | hsl(161, 74%, 53%) |
| HSV | hsv(161, 80%, 87%) |
| CMYK | cmyk(79.8%, 0%, 25.6%, 12.5%) |
| CIE-LAB | lab(79.66, -56.18, 15.86) |
| CIE-LCH | lch(79.66, 58.38, 164.23°) |
| OKLab | oklab(80.5% -0.1544 0.0405) |
| OKLCH | oklch(80.5% 0.16 165.3) |
| XYZ | xyz(34.3488, 56.0821, 45.0836) |
| Luminance | 0.5609 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Eucalyptus
#44D7A8
ΔE00 2.72
Aqua Marine
#2EE8BB
ΔE00 3.83
Aqua Green
#12E193
ΔE00 4.10
Aquamarine (survey)
#04D8B2
ΔE00 4.92
Seafoam
#7FE0B3
ΔE00 5.87
Light Greenish Blue
#63F7B4
ΔE00 6.16
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#2DDFA6 #DF2D66
analogous
#2DDF4D #2DDFA6 #2DBFDF
triadic
#2DDFA6 #A62DDF #DFA62D
tetradic
#2DDFA6 #4D2DDF #DF2D66 #BFDF2D
square
#2DDFA6 #4D2DDF #DF2D66 #BFDF2D
split-complementary
#2DDFA6 #DF2DBF #DF4D2D
monochromatic
#137E5C #1BB383 #2DDFA6 #62E7BD #97EFD3
Accessibility & contrast
On white
1.72
#2DDFA6 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.22
#2DDFA6 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #2DDFA6
12.22:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##2DDFA6 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##2DDFA6 | 1.00 | 1.72 | 12.22 | 12.22 |
| #FFFFFF | 1.72 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.22 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.22 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#DACFA3
Deuteranopia (green-blind)
#C5BFAA
Tritanopia (blue-blind)
#00DFCF
Achromatopsia (no color)
#C5C5C5
Design tokens & code
CSS
--color: #2ddfa6; /* rgb */ color: rgb(45, 223, 166); /* oklch */ color: oklch(80.5% 0.160 165.3);
Tailwind
colors: {
custom: {
50: '#84eac0',
500: '#2ddfa6',
950: '#000000',
},
}SCSS
$custom: #2ddfa6; $custom-light: #84eac0; $custom-dark: #000000;
JSON
{
"hex": "#2ddfa6",
"rgb": {
"r": 45,
"g": 223,
"b": 166
},
"hsl": {
"h": 160.787,
"s": 73.554,
"l": 52.549
},
"oklch": {
"l": 0.80502,
"c": 0.15963,
"h": 165.3
},
"luminance": 0.56086
}Semantic roles & 50–950 ramp
primary
#2DDFA6
secondary
#852B48
accent
#3873F0
background
#FCFEFD
surface
#F4FDF9
border
#CED5D2
text
#0D1612
muted
#7F8482