#5AC261#5AC261
#5AC261 is a light, vivid green. Relative luminance 0.416; OKLCH L 73.0% C 0.166 H 144.9°. Best body text is #000000 at 9.32:1 contrast (WCAG AA passes).
Color values
| HEX | #5AC261 |
|---|---|
| RGB | rgb(90, 194, 97) |
| HSL | hsl(124, 46%, 56%) |
| HSV | hsv(124, 54%, 76%) |
| CMYK | cmyk(53.6%, 0%, 50%, 23.9%) |
| CIE-LAB | lab(70.61, -50.13, 39.58) |
| CIE-LCH | lch(70.61, 63.88, 141.71°) |
| OKLab | oklab(72.96% -0.136 0.0957) |
| OKLCH | oklch(72.96% 0.166 144.9) |
| XYZ | xyz(25.6644, 41.6182, 17.9876) |
| Luminance | 0.4162 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Soft Green
#6FC276
ΔE00 3.71
Dark Mint
#48C072
ΔE00 4.07
Emerald
#50C878
ΔE00 4.08
Fern
#63B76C
ΔE00 4.24
Shamrock Green
#02C14D
ΔE00 4.29
Boring Green
#63B365
ΔE00 4.66
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#5AC261 #C25ABB
analogous
#87C25A #5AC261 #5AC295
triadic
#5AC261 #615AC2 #C2615A
tetradic
#5AC261 #5A87C2 #C25ABB #C2955A
square
#5AC261 #5A87C2 #C25ABB #C2955A
split-complementary
#5AC261 #955AC2 #C25A87
monochromatic
#2C7631 #3CA343 #5AC261 #87D38C #B3E3B7
Accessibility & contrast
On white
2.25
#5AC261 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.32
#5AC261 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #5AC261
9.32:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##5AC261 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##5AC261 | 1.00 | 2.25 | 9.32 | 9.32 |
| #FFFFFF | 2.25 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.32 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.32 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C5B259
Deuteranopia (green-blind)
#B7A968
Tritanopia (blue-blind)
#48BDAB
Achromatopsia (no color)
#ADADAD
Design tokens & code
CSS
--color: #5ac261; /* rgb */ color: rgb(90, 194, 97); /* oklch */ color: oklch(73.0% 0.166 144.9);
Tailwind
colors: {
custom: {
50: '#91d590',
500: '#5ac261',
950: '#000000',
},
}SCSS
$custom: #5ac261; $custom-light: #91d590; $custom-dark: #000000;
JSON
{
"hex": "#5ac261",
"rgb": {
"r": 90,
"g": 194,
"b": 97
},
"hsl": {
"h": 124.038,
"s": 46.018,
"l": 55.686
},
"oklch": {
"l": 0.72961,
"c": 0.16631,
"h": 144.9
},
"luminance": 0.4162
}Semantic roles & 50–950 ramp
primary
#5AC261
secondary
#D2A6CF
accent
#52CDD6
background
#F9FDF8
surface
#F2FAF0
border
#CCD3CB
text
#0D140D
muted
#7E837D