#5BBE36#5BBE36
#5BBE36 is a light, vivid green. Relative luminance 0.393; OKLCH L 71.5% C 0.195 H 138.6°. Best body text is #000000 at 8.86:1 contrast (WCAG AA passes).
Color values
| HEX | #5BBE36 |
|---|---|
| RGB | rgb(91, 190, 54) |
| HSL | hsl(104, 56%, 48%) |
| HSV | hsv(104, 72%, 75%) |
| CMYK | cmyk(52.1%, 0%, 71.6%, 25.5%) |
| CIE-LAB | lab(68.98, -52.95, 56.75) |
| CIE-LCH | lch(68.98, 77.61, 133.02°) |
| OKLab | oklab(71.5% -0.146 0.1285) |
| OKLCH | oklch(71.5% 0.195 138.6) |
| XYZ | xyz(23.3928, 39.3156, 9.8453) |
| Luminance | 0.3932 (WCAG relative) |
| Temperature | warm |
| Family | green |
Closest named colors
Kelly Green
#4CBB17
ΔE00 2.30
Leafy Green
#51B73B
ΔE00 2.47
Frog Green
#58BC08
ΔE00 2.90
Apple
#6ECB3C
ΔE00 3.82
Turtle Green
#75B84F
ΔE00 4.19
Nasty Green
#70B23F
ΔE00 4.32
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#5BBE36 #9936BE
analogous
#9FBE36 #5BBE36 #36BE55
triadic
#5BBE36 #365BBE #BE365B
tetradic
#5BBE36 #369FBE #9936BE #BE5536
square
#5BBE36 #369FBE #9936BE #BE5536
split-complementary
#5BBE36 #5536BE #BE369F
monochromatic
#2D5F1B #448E28 #5BBE36 #7FD260 #A5DF8F
Accessibility & contrast
On white
2.37
#5BBE36 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.86
#5BBE36 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #5BBE36
8.86:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##5BBE36 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##5BBE36 | 1.00 | 2.37 | 8.86 | 8.86 |
| #FFFFFF | 2.37 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.86 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.86 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C4AD1F
Deuteranopia (green-blind)
#B7A543
Tritanopia (blue-blind)
#52B8A3
Achromatopsia (no color)
#A8A8A8
Design tokens & code
CSS
--color: #5bbe36; /* rgb */ color: rgb(91, 190, 54); /* oklch */ color: oklch(71.5% 0.195 138.6);
Tailwind
colors: {
custom: {
50: '#93d275',
500: '#5bbe36',
950: '#000000',
},
}SCSS
$custom: #5bbe36; $custom-light: #93d275; $custom-dark: #000000;
JSON
{
"hex": "#5bbe36",
"rgb": {
"r": 91,
"g": 190,
"b": 54
},
"hsl": {
"h": 103.676,
"s": 55.738,
"l": 47.843
},
"oklch": {
"l": 0.71497,
"c": 0.19451,
"h": 138.6
},
"luminance": 0.39317
}Semantic roles & 50–950 ramp
primary
#5BBE36
secondary
#B786CA
accent
#49DFB6
background
#F9FDF7
surface
#F2FAED
border
#CCD3C8
text
#0E1409
muted
#7E837B