#61DCA3#61DCA3
#61DCA3 is a light, vivid teal. Relative luminance 0.564; OKLCH L 80.9% C 0.138 H 160.8°. Best body text is #000000 at 12.27:1 contrast (WCAG AA passes).
Color values
| HEX | #61DCA3 |
|---|---|
| RGB | rgb(97, 220, 163) |
| HSL | hsl(152, 64%, 62%) |
| HSV | hsv(152, 56%, 86%) |
| CMYK | cmyk(55.9%, 0%, 25.9%, 13.7%) |
| CIE-LAB | lab(79.82, -47.52, 17.84) |
| CIE-LCH | lch(79.82, 50.76, 159.43°) |
| OKLab | oklab(80.94% -0.1306 0.0455) |
| OKLCH | oklch(80.94% 0.138 160.8) |
| XYZ | xyz(37.1305, 56.3687, 43.5667) |
| Luminance | 0.5637 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Eucalyptus
#44D7A8
ΔE00 3.53
Seafoam
#7FE0B3
ΔE00 3.73
Aqua Green
#12E193
ΔE00 4.76
Aqua Marine
#2EE8BB
ΔE00 5.73
Mediumaquamarine
#66CDAA
ΔE00 5.99
Light Greenish Blue
#63F7B4
ΔE00 5.99
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#61DCA3 #DC619A
analogous
#61DC65 #61DCA3 #61D8DC
triadic
#61DCA3 #A361DC #DCA361
tetradic
#61DCA3 #6561DC #DC619A #D8DC61
square
#61DCA3 #6561DC #DC619A #D8DC61
split-complementary
#61DCA3 #DC61D8 #DC6561
monochromatic
#239F66 #2FD186 #61DCA3 #93E7C0 #C5F2DD
Accessibility & contrast
On white
1.71
#61DCA3 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.27
#61DCA3 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #61DCA3
12.27:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##61DCA3 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##61DCA3 | 1.00 | 1.71 | 12.27 | 12.27 |
| #FFFFFF | 1.71 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.27 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.27 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#D9CDA0
Deuteranopia (green-blind)
#C8C1A7
Tritanopia (blue-blind)
#30DBCC
Achromatopsia (no color)
#C6C6C6
Design tokens & code
CSS
--color: #61dca3; /* rgb */ color: rgb(97, 220, 163); /* oklch */ color: oklch(80.9% 0.138 160.8);
Tailwind
colors: {
custom: {
50: '#97e7be',
500: '#61dca3',
950: '#000000',
},
}SCSS
$custom: #61dca3; $custom-light: #97e7be; $custom-dark: #000000;
JSON
{
"hex": "#61dca3",
"rgb": {
"r": 97,
"g": 220,
"b": 163
},
"hsl": {
"h": 152.195,
"s": 63.731,
"l": 62.157
},
"oklch": {
"l": 0.80936,
"c": 0.13827,
"h": 160.8
},
"luminance": 0.56372
}Semantic roles & 50–950 ramp
primary
#61DCA3
secondary
#A33E6D
accent
#1A6CCC
background
#FCFEFD
surface
#F5FDF8
border
#CFD5D1
text
#0E1612
muted
#7F8482