#3FCC7C#3FCC7C
#3FCC7C is a light, vivid green. Relative luminance 0.457; OKLCH L 75.1% C 0.166 H 154.0°. Best body text is #000000 at 10.14:1 contrast (WCAG AA passes).
Color values
| HEX | #3FCC7C |
|---|---|
| RGB | rgb(63, 204, 124) |
| HSL | hsl(146, 58%, 52%) |
| HSV | hsv(146, 69%, 80%) |
| CMYK | cmyk(69.1%, 0%, 39.2%, 20%) |
| CIE-LAB | lab(73.35, -55.31, 29.26) |
| CIE-LCH | lch(73.35, 62.57, 152.12°) |
| OKLab | oklab(75.13% -0.1493 0.0729) |
| OKLCH | oklch(75.13% 0.166 154) |
| XYZ | xyz(27.2784, 45.6947, 26.4472) |
| Luminance | 0.4570 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Emerald
#50C878
ΔE00 1.64
Seaweed
#18D17B
ΔE00 1.89
Algae Green
#21C36F
ΔE00 2.83
Dark Mint
#48C072
ΔE00 3.17
Dark Mint Green
#20C073
ΔE00 3.46
Tealish Green
#0CDC73
ΔE00 4.94
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#3FCC7C #CC3F8F
analogous
#49CC3F #3FCC7C #3FCCC2
triadic
#3FCC7C #7C3FCC #CC7C3F
tetradic
#3FCC7C #3F49CC #CC3F8F #CCC23F
square
#3FCC7C #3F49CC #CC3F8F #CCC23F
split-complementary
#3FCC7C #C23FCC #CC3F49
monochromatic
#1E7243 #2BA35F #3FCC7C #6FD99D #A0E6BE
Accessibility & contrast
On white
2.07
#3FCC7C on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.14
#3FCC7C on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #3FCC7C
10.14:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##3FCC7C | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##3FCC7C | 1.00 | 2.07 | 10.14 | 10.14 |
| #FFFFFF | 2.07 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.14 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.14 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#CCBC76
Deuteranopia (green-blind)
#BAAF81
Tritanopia (blue-blind)
#00CAB8
Achromatopsia (no color)
#B4B4B4
Design tokens & code
CSS
--color: #3fcc7c; /* rgb */ color: rgb(63, 204, 124); /* oklch */ color: oklch(75.1% 0.166 154.0);
Tailwind
colors: {
custom: {
50: '#85dda2',
500: '#3fcc7c',
950: '#000000',
},
}SCSS
$custom: #3fcc7c; $custom-light: #85dda2; $custom-dark: #000000;
JSON
{
"hex": "#3fcc7c",
"rgb": {
"r": 63,
"g": 204,
"b": 124
},
"hsl": {
"h": 145.957,
"s": 58.025,
"l": 52.353
},
"oklch": {
"l": 0.75133,
"c": 0.16617,
"h": 154
},
"luminance": 0.45698
}Semantic roles & 50–950 ramp
primary
#3FCC7C
secondary
#D295B8
accent
#479EE1
background
#F8FDFA
surface
#F0FBF3
border
#CBD4CD
text
#0C150F
muted
#7D837F