#55D497#55D497
#55D497 is a light, vivid teal. Relative luminance 0.513; OKLCH L 78.3% C 0.144 H 159.3°. Best body text is #000000 at 11.25:1 contrast (WCAG AA passes).
Color values
| HEX | #55D497 |
|---|---|
| RGB | rgb(85, 212, 151) |
| HSL | hsl(151, 60%, 58%) |
| HSV | hsv(151, 60%, 83%) |
| CMYK | cmyk(59.9%, 0%, 28.8%, 16.9%) |
| CIE-LAB | lab(76.83, -49.16, 19.95) |
| CIE-LCH | lch(76.83, 53.05, 157.92°) |
| OKLab | oklab(78.31% -0.1344 0.0507) |
| OKLCH | oklch(78.31% 0.144 159.3) |
| XYZ | xyz(32.8727, 51.2494, 37.4319) |
| Luminance | 0.5125 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Eucalyptus
#44D7A8
ΔE00 3.99
Aqua Green
#12E193
ΔE00 4.48
Greenblue
#23C48B
ΔE00 4.93
Seaweed
#18D17B
ΔE00 5.12
Emerald
#50C878
ΔE00 5.36
Seafoam
#7FE0B3
ΔE00 5.66
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#55D497 #D45592
analogous
#55D457 #55D497 #55D1D4
triadic
#55D497 #9755D4 #D49755
tetradic
#55D497 #5755D4 #D45592 #D1D455
square
#55D497 #5755D4 #D45592 #D1D455
split-complementary
#55D497 #D455D1 #D45755
monochromatic
#238B59 #30BC79 #55D497 #86E0B5 #B7EDD3
Accessibility & contrast
On white
1.87
#55D497 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.25
#55D497 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #55D497
11.25:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##55D497 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##55D497 | 1.00 | 1.87 | 11.25 | 11.25 |
| #FFFFFF | 1.87 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.25 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.25 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#D2C593
Deuteranopia (green-blind)
#C0B99B
Tritanopia (blue-blind)
#16D3C4
Achromatopsia (no color)
#BEBEBE
Design tokens & code
CSS
--color: #55d497; /* rgb */ color: rgb(85, 212, 151); /* oklch */ color: oklch(78.3% 0.144 159.3);
Tailwind
colors: {
custom: {
50: '#90e2b5',
500: '#55d497',
950: '#000000',
},
}SCSS
$custom: #55d497; $custom-light: #90e2b5; $custom-dark: #000000;
JSON
{
"hex": "#55d497",
"rgb": {
"r": 85,
"g": 212,
"b": 151
},
"hsl": {
"h": 151.181,
"s": 59.624,
"l": 58.235
},
"oklch": {
"l": 0.78309,
"c": 0.14364,
"h": 159.3
},
"luminance": 0.51253
}Semantic roles & 50–950 ramp
primary
#55D497
secondary
#913C65
accent
#4591E3
background
#FCFEFD
surface
#F5FCF8
border
#CFD5D1
text
#0E1511
muted
#7F8481