#54C43E#54C43E
#54C43E is a light, vivid green. Relative luminance 0.417; OKLCH L 72.8% C 0.200 H 140.6°. Best body text is #000000 at 9.34:1 contrast (WCAG AA passes).
Color values
| HEX | #54C43E |
|---|---|
| RGB | rgb(84, 196, 62) |
| HSL | hsl(110, 53%, 51%) |
| HSV | hsv(110, 68%, 77%) |
| CMYK | cmyk(57.1%, 0%, 68.4%, 23.1%) |
| CIE-LAB | lab(70.67, -56.39, 55.37) |
| CIE-LCH | lch(70.67, 79.03, 135.53°) |
| OKLab | oklab(72.84% -0.1544 0.1267) |
| OKLCH | oklch(72.84% 0.2 140.6) |
| XYZ | xyz(24.2645, 41.7104, 11.3287) |
| Luminance | 0.4171 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Lime Green
#32CD32
ΔE00 3.08
Apple
#6ECB3C
ΔE00 3.37
Leafy Green
#51B73B
ΔE00 3.50
Kelly Green
#4CBB17
ΔE00 3.58
Frog Green
#58BC08
ΔE00 4.28
Shamrock Green
#02C14D
ΔE00 4.99
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#54C43E #AE3EC4
analogous
#97C43E #54C43E #3EC46B
triadic
#54C43E #3E54C4 #C43E54
tetradic
#54C43E #3E97C4 #AE3EC4 #C46B3E
square
#54C43E #3E97C4 #AE3EC4 #C46B3E
split-complementary
#54C43E #6B3EC4 #C43E97
monochromatic
#2C6820 #3F972E #54C43E #7ED26D #A7E19C
Accessibility & contrast
On white
2.25
#54C43E on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.34
#54C43E on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #54C43E
9.34:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##54C43E | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##54C43E | 1.00 | 2.25 | 9.34 | 9.34 |
| #FFFFFF | 2.25 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.34 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.34 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C9B32B
Deuteranopia (green-blind)
#BBA94A
Tritanopia (blue-blind)
#45BEA9
Achromatopsia (no color)
#ADADAD
Design tokens & code
CSS
--color: #54c43e; /* rgb */ color: rgb(84, 196, 62); /* oklch */ color: oklch(72.8% 0.200 140.6);
Tailwind
colors: {
custom: {
50: '#8fd77a',
500: '#54c43e',
950: '#000000',
},
}SCSS
$custom: #54c43e; $custom-light: #8fd77a; $custom-dark: #000000;
JSON
{
"hex": "#54c43e",
"rgb": {
"r": 84,
"g": 196,
"b": 62
},
"hsl": {
"h": 110.149,
"s": 53.175,
"l": 50.588
},
"oklch": {
"l": 0.72842,
"c": 0.19974,
"h": 140.6
},
"luminance": 0.41712
}Semantic roles & 50–950 ramp
primary
#54C43E
secondary
#C391CD
accent
#4BDDC5
background
#F9FDF7
surface
#F2FAEE
border
#CCD3C9
text
#0E140A
muted
#7E837C