#33C442#33C442
#33C442 is a light, highly saturated green. Relative luminance 0.406; OKLCH L 72.0% C 0.209 H 144.4°. Best body text is #000000 at 9.12:1 contrast (WCAG AA passes).
Color values
| HEX | #33C442 |
|---|---|
| RGB | rgb(51, 196, 66) |
| HSL | hsl(126, 59%, 48%) |
| HSV | hsv(126, 74%, 77%) |
| CMYK | cmyk(74%, 0%, 66.3%, 23.1%) |
| CIE-LAB | lab(69.88, -62.76, 52.65) |
| CIE-LCH | lch(69.88, 81.92, 140.00°) |
| OKLab | oklab(71.96% -0.1697 0.1217) |
| OKLCH | oklch(71.96% 0.209 144.4) |
| XYZ | xyz(22.0871, 40.5745, 11.8208) |
| Luminance | 0.4058 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Shamrock Green
#02C14D
ΔE00 2.64
Lime Green
#32CD32
ΔE00 3.09
Leafy Green
#51B73B
ΔE00 4.05
Kelly Green
#4CBB17
ΔE00 4.89
Shamrock
#01B44C
ΔE00 5.62
Apple
#6ECB3C
ΔE00 5.68
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#33C442 #C433B5
analogous
#6CC433 #33C442 #33C48A
triadic
#33C442 #4233C4 #C44233
tetradic
#33C442 #336CC4 #C433B5 #C48A33
square
#33C442 #336CC4 #C433B5 #C48A33
split-complementary
#33C442 #8A33C4 #C4336C
monochromatic
#1A6321 #269332 #33C442 #5FD56B #8FE298
Accessibility & contrast
On white
2.30
#33C442 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.12
#33C442 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #33C442
9.12:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##33C442 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##33C442 | 1.00 | 2.30 | 9.12 | 9.12 |
| #FFFFFF | 2.30 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.12 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.12 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C8B231
Deuteranopia (green-blind)
#B7A64E
Tritanopia (blue-blind)
#00BFA9
Achromatopsia (no color)
#ABABAB
Design tokens & code
CSS
--color: #33c442; /* rgb */ color: rgb(51, 196, 66); /* oklch */ color: oklch(72.0% 0.209 144.4);
Tailwind
colors: {
custom: {
50: '#81d77c',
500: '#33c442',
950: '#000000',
},
}SCSS
$custom: #33c442; $custom-light: #81d77c; $custom-dark: #000000;
JSON
{
"hex": "#33c442",
"rgb": {
"r": 51,
"g": 196,
"b": 66
},
"hsl": {
"h": 126.207,
"s": 58.704,
"l": 48.431
},
"oklch": {
"l": 0.71961,
"c": 0.2088,
"h": 144.4
},
"luminance": 0.40577
}Semantic roles & 50–950 ramp
primary
#33C442
secondary
#CD86C5
accent
#46D2E2
background
#F8FDF7
surface
#F0FAEE
border
#CBD3C9
text
#0C150A
muted
#7D837C