#42CAA3#42CAA3
#42CAA3 is a light, vivid teal. Relative luminance 0.460; OKLCH L 75.6% C 0.130 H 169.9°. Best body text is #000000 at 10.21:1 contrast (WCAG AA passes).
Color values
| HEX | #42CAA3 |
|---|---|
| RGB | rgb(66, 202, 163) |
| HSL | hsl(163, 56%, 53%) |
| HSV | hsv(163, 67%, 79%) |
| CMYK | cmyk(67.3%, 0%, 19.3%, 20.8%) |
| CIE-LAB | lab(73.57, -45.75, 8.90) |
| CIE-LCH | lch(73.57, 46.61, 168.99°) |
| OKLab | oklab(75.59% -0.1279 0.0227) |
| OKLCH | oklch(75.59% 0.13 169.9) |
| XYZ | xyz(29.9748, 46.0403, 41.9502) |
| Luminance | 0.4604 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Mediumaquamarine
#66CDAA
ΔE00 3.01
Eucalyptus
#44D7A8
ΔE00 3.51
Aquamarine (survey)
#04D8B2
ΔE00 4.02
Green Blue
#01C08D
ΔE00 4.61
Greenblue
#23C48B
ΔE00 4.94
Seafoam Blue
#78D1B6
ΔE00 5.72
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#42CAA3 #CA4269
analogous
#42CA5F #42CAA3 #42ADCA
triadic
#42CAA3 #A342CA #CAA342
tetradic
#42CAA3 #5F42CA #CA4269 #ADCA42
square
#42CAA3 #5F42CA #CA4269 #ADCA42
split-complementary
#42CAA3 #CA42AD #CA5F42
monochromatic
#20725A #2DA280 #42CAA3 #72D7BA #A2E5D2
Accessibility & contrast
On white
2.06
#42CAA3 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.21
#42CAA3 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #42CAA3
10.21:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##42CAA3 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##42CAA3 | 1.00 | 2.06 | 10.21 | 10.21 |
| #FFFFFF | 2.06 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.21 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.21 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C4BDA1
Deuteranopia (green-blind)
#B2AFA6
Tritanopia (blue-blind)
#00CBBF
Achromatopsia (no color)
#B5B5B5
Design tokens & code
CSS
--color: #42caa3; /* rgb */ color: rgb(66, 202, 163); /* oklch */ color: oklch(75.6% 0.130 169.9);
Tailwind
colors: {
custom: {
50: '#87dbbe',
500: '#42caa3',
950: '#000000',
},
}SCSS
$custom: #42caa3; $custom-light: #87dbbe; $custom-dark: #000000;
JSON
{
"hex": "#42caa3",
"rgb": {
"r": 66,
"g": 202,
"b": 163
},
"hsl": {
"h": 162.794,
"s": 56.198,
"l": 52.549
},
"oklch": {
"l": 0.75591,
"c": 0.12995,
"h": 169.9
},
"luminance": 0.46044
}Semantic roles & 50–950 ramp
primary
#42CAA3
secondary
#D196A7
accent
#4874DF
background
#F8FDFB
surface
#F0FBF6
border
#CBD4D0
text
#0D1512
muted
#7D8381