#B2C776#B2C776
#B2C776 is a light, moderate yellow-green. Relative luminance 0.516; OKLCH L 79.5% C 0.108 H 120.8°. Best body text is #000000 at 11.32:1 contrast (WCAG AA passes).
Color values
| HEX | #B2C776 |
|---|---|
| RGB | rgb(178, 199, 118) |
| HSL | hsl(76, 42%, 62%) |
| HSV | hsv(76, 41%, 78%) |
| CMYK | cmyk(10.6%, 0%, 40.7%, 22%) |
| CIE-LAB | lab(77.05, -20.09, 38.16) |
| CIE-LCH | lch(77.05, 43.12, 117.77°) |
| OKLab | oklab(79.51% -0.0554 0.093) |
| OKLCH | oklch(79.51% 0.108 120.8) |
| XYZ | xyz(42.0535, 51.6199, 24.8842) |
| Luminance | 0.5162 (WCAG relative) |
| Temperature | warm |
| Family | yellow-green |
Closest named colors
Pale Olive
#B9CC81
ΔE00 1.84
Greenish Tan
#BCCB7A
ΔE00 1.95
Light Olive
#ACBF69
ΔE00 2.38
Tan Green
#A9BE70
ΔE00 2.39
Light Moss Green
#A6C875
ΔE00 2.83
Pale Olive Green
#B1D27B
ΔE00 3.31
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#B2C776 #8B76C7
analogous
#C7B476 #B2C776 #89C776
triadic
#B2C776 #76B2C7 #C776B2
tetradic
#B2C776 #76C7B4 #8B76C7 #C77689
square
#B2C776 #76C7B4 #8B76C7 #C77689
split-complementary
#B2C776 #7689C7 #B476C7
monochromatic
#758A38 #9AB54B #B2C776 #CAD9A1 #E3EBCD
Accessibility & contrast
On white
1.85
#B2C776 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.32
#B2C776 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #B2C776
11.32:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##B2C776 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##B2C776 | 1.00 | 1.85 | 11.32 | 11.32 |
| #FFFFFF | 1.85 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.32 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.32 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#D0BF70
Deuteranopia (green-blind)
#CDBE7A
Tritanopia (blue-blind)
#B9BFB3
Achromatopsia (no color)
#BEBEBE
Design tokens & code
CSS
--color: #b2c776; /* rgb */ color: rgb(178, 199, 118); /* oklch */ color: oklch(79.5% 0.108 120.8);
Tailwind
colors: {
custom: {
50: '#cad89e',
500: '#b2c776',
950: '#000000',
},
}SCSS
$custom: #b2c776; $custom-light: #cad89e; $custom-dark: #000000;
JSON
{
"hex": "#b2c776",
"rgb": {
"r": 178,
"g": 199,
"b": 118
},
"hsl": {
"h": 75.556,
"s": 41.969,
"l": 62.157
},
"oklch": {
"l": 0.79514,
"c": 0.10831,
"h": 120.8
},
"luminance": 0.5162
}Semantic roles & 50–950 ramp
primary
#B2C776
secondary
#615092
accent
#30B553
background
#FEFEFC
surface
#FAFBF5
border
#D3D4CF
text
#13140E
muted
#83837F