#5AC436#5AC436
#5AC436 is a light, highly saturated green. Relative luminance 0.419; OKLCH L 73.0% C 0.202 H 139.1°. Best body text is #000000 at 9.38:1 contrast (WCAG AA passes).
Color values
| HEX | #5AC436 |
|---|---|
| RGB | rgb(90, 196, 54) |
| HSL | hsl(105, 57%, 49%) |
| HSV | hsv(105, 72%, 77%) |
| CMYK | cmyk(54.1%, 0%, 72.4%, 23.1%) |
| CIE-LAB | lab(70.81, -55.47, 58.60) |
| CIE-LCH | lch(70.81, 80.69, 133.43°) |
| OKLab | oklab(73% -0.1527 0.1324) |
| OKLCH | oklch(73% 0.202 139.1) |
| XYZ | xyz(24.6213, 41.9179, 10.2828) |
| Luminance | 0.4192 (WCAG relative) |
| Temperature | warm |
| Family | green |
Closest named colors
Apple
#6ECB3C
ΔE00 2.61
Kelly Green
#4CBB17
ΔE00 3.04
Frog Green
#58BC08
ΔE00 3.36
Lime Green
#32CD32
ΔE00 3.38
Leafy Green
#51B73B
ΔE00 3.86
Apple Green
#76CD26
ΔE00 4.55
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#5AC436 #A036C4
analogous
#A1C436 #5AC436 #36C459
triadic
#5AC436 #365AC4 #C4365A
tetradic
#5AC436 #36A1C4 #A036C4 #C45936
square
#5AC436 #36A1C4 #A036C4 #C45936
split-complementary
#5AC436 #5936C4 #C436A1
monochromatic
#2E641C #449429 #5AC436 #80D463 #A7E193
Accessibility & contrast
On white
2.24
#5AC436 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.38
#5AC436 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #5AC436
9.38:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##5AC436 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##5AC436 | 1.00 | 2.24 | 9.38 | 9.38 |
| #FFFFFF | 2.24 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.38 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.38 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#CAB31C
Deuteranopia (green-blind)
#BCAA44
Tritanopia (blue-blind)
#50BDA8
Achromatopsia (no color)
#ADADAD
Design tokens & code
CSS
--color: #5ac436; /* rgb */ color: rgb(90, 196, 54); /* oklch */ color: oklch(73.0% 0.202 139.1);
Tailwind
colors: {
custom: {
50: '#93d776',
500: '#5ac436',
950: '#000000',
},
}SCSS
$custom: #5ac436; $custom-light: #93d776; $custom-dark: #000000;
JSON
{
"hex": "#5ac436",
"rgb": {
"r": 90,
"g": 196,
"b": 54
},
"hsl": {
"h": 104.789,
"s": 56.8,
"l": 49.02
},
"oklch": {
"l": 0.72999,
"c": 0.20214,
"h": 139.1
},
"luminance": 0.4192
}Semantic roles & 50–950 ramp
primary
#5AC436
secondary
#BB89CC
accent
#48E0B9
background
#F9FDF7
surface
#F2FAED
border
#CCD3C8
text
#0E1409
muted
#7E837B