#57C57C#57C57C
#57C57C is a light, vivid green. Relative luminance 0.434; OKLCH L 74.1% C 0.146 H 152.2°. Best body text is #000000 at 9.68:1 contrast (WCAG AA passes).
Color values
| HEX | #57C57C |
|---|---|
| RGB | rgb(87, 197, 124) |
| HSL | hsl(140, 49%, 56%) |
| HSV | hsv(140, 56%, 77%) |
| CMYK | cmyk(55.8%, 0%, 37.1%, 22.7%) |
| CIE-LAB | lab(71.83, -47.76, 27.37) |
| CIE-LCH | lch(71.83, 55.05, 150.19°) |
| OKLab | oklab(74.07% -0.1295 0.0684) |
| OKLCH | oklch(74.07% 0.146 152.2) |
| XYZ | xyz(27.5328, 43.4115, 25.9932) |
| Luminance | 0.4341 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Emerald
#50C878
ΔE00 1.38
Dark Mint
#48C072
ΔE00 1.98
Soft Green
#6FC276
ΔE00 3.19
Algae Green
#21C36F
ΔE00 3.44
Dark Mint Green
#20C073
ΔE00 3.54
Seaweed
#18D17B
ΔE00 4.40
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#57C57C #C557A0
analogous
#69C557 #57C57C #57C5B3
triadic
#57C57C #7C57C5 #C57C57
tetradic
#57C57C #5769C5 #C557A0 #C5B357
square
#57C57C #5769C5 #C557A0 #C5B357
split-complementary
#57C57C #B357C5 #C55769
monochromatic
#297844 #39A65E #57C57C #84D59F #B2E4C3
Accessibility & contrast
On white
2.17
#57C57C on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.68
#57C57C on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #57C57C
9.68:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##57C57C | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##57C57C | 1.00 | 2.17 | 9.68 | 9.68 |
| #FFFFFF | 2.17 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.68 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.68 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C5B677
Deuteranopia (green-blind)
#B6AC81
Tritanopia (blue-blind)
#39C2B2
Achromatopsia (no color)
#B0B0B0
Design tokens & code
CSS
--color: #57c57c; /* rgb */ color: rgb(87, 197, 124); /* oklch */ color: oklch(74.1% 0.146 152.2);
Tailwind
colors: {
custom: {
50: '#8fd7a2',
500: '#57c57c',
950: '#000000',
},
}SCSS
$custom: #57c57c; $custom-light: #8fd7a2; $custom-dark: #000000;
JSON
{
"hex": "#57c57c",
"rgb": {
"r": 87,
"g": 197,
"b": 124
},
"hsl": {
"h": 140.182,
"s": 48.673,
"l": 55.686
},
"oklch": {
"l": 0.74071,
"c": 0.14649,
"h": 152.2
},
"luminance": 0.43414
}Semantic roles & 50–950 ramp
primary
#57C57C
secondary
#D3A5C3
accent
#50AAD8
background
#F9FDFA
surface
#F2FAF3
border
#CCD3CD
text
#0D140F
muted
#7E837F