#A2D2D9#A2D2D9
#A2D2D9 is a very light, muted teal. Relative luminance 0.588; OKLCH L 83.2% C 0.051 H 207.3°. Best body text is #000000 at 12.76:1 contrast (WCAG AA passes).
Color values
| HEX | #A2D2D9 |
|---|---|
| RGB | rgb(162, 210, 217) |
| HSL | hsl(188, 42%, 74%) |
| HSV | hsv(188, 25%, 85%) |
| CMYK | cmyk(25.3%, 3.2%, 0%, 14.9%) |
| CIE-LAB | lab(81.17, -13.96, -8.56) |
| CIE-LCH | lch(81.17, 16.38, 211.50°) |
| OKLab | oklab(83.24% -0.0452 -0.0233) |
| OKLCH | oklch(83.24% 0.051 207.3) |
| XYZ | xyz(50.4674, 58.7821, 74.3191) |
| Luminance | 0.5878 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Powder Blue
#B0E0E6
ΔE00 3.33
Lightblue
#ADD8E6
ΔE00 4.03
Paleturquoise
#AFEEEE
ΔE00 7.37
Ice Blue
#A5DFF9
ΔE00 7.39
Sky Blue
#87CEEB
ΔE00 7.63
Pale Sky Blue
#BDF6FE
ΔE00 8.02
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#A2D2D9 #D9A9A2
analogous
#A2D9C5 #A2D2D9 #A2B7D9
triadic
#A2D2D9 #D9A2D2 #D2D9A2
tetradic
#A2D2D9 #C5A2D9 #D9A9A2 #B7D9A2
square
#A2D2D9 #C5A2D9 #D9A9A2 #B7D9A2
split-complementary
#A2D2D9 #D9A2B7 #D9C5A2
monochromatic
#4BA8B5 #77BDC7 #A2D2D9 #CDE7EB #E9F4F6
Accessibility & contrast
On white
1.65
#A2D2D9 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.76
#A2D2D9 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #A2D2D9
12.76:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##A2D2D9 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##A2D2D9 | 1.00 | 1.65 | 12.76 | 12.76 |
| #FFFFFF | 1.65 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.76 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.76 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#CACEDA
Deuteranopia (green-blind)
#C0C6D9
Tritanopia (blue-blind)
#90D6D4
Achromatopsia (no color)
#CACACA
Design tokens & code
CSS
--color: #a2d2d9; /* rgb */ color: rgb(162, 210, 217); /* oklch */ color: oklch(83.2% 0.051 207.3);
Tailwind
colors: {
custom: {
50: '#bfdfe4',
500: '#a2d2d9',
950: '#000000',
},
}SCSS
$custom: #a2d2d9; $custom-light: #bfdfe4; $custom-dark: #000000;
JSON
{
"hex": "#a2d2d9",
"rgb": {
"r": 162,
"g": 210,
"b": 217
},
"hsl": {
"h": 187.636,
"s": 41.985,
"l": 74.314
},
"oklch": {
"l": 0.83236,
"c": 0.05085,
"h": 207.3
},
"luminance": 0.58784
}Semantic roles & 50–950 ramp
primary
#A2D2D9
secondary
#B0776F
accent
#4130B5
background
#FDFEFE
surface
#F9FCFC
border
#D2D5D5
text
#121515
muted
#828484