#DEF77B#DEF77B
#DEF77B is a very light, vivid yellow-green. Relative luminance 0.835; OKLCH L 93.3% C 0.152 H 118.9°. Best body text is #000000 at 17.70:1 contrast (WCAG AA passes).
Color values
| HEX | #DEF77B |
|---|---|
| RGB | rgb(222, 247, 123) |
| HSL | hsl(72, 89%, 73%) |
| HSV | hsv(72, 50%, 97%) |
| CMYK | cmyk(10.1%, 0%, 50.2%, 3.1%) |
| CIE-LAB | lab(93.22, -25.90, 56.29) |
| CIE-LCH | lch(93.22, 61.96, 114.70°) |
| OKLab | oklab(93.26% -0.0735 0.1333) |
| OKLCH | oklch(93.26% 0.152 118.9) |
| XYZ | xyz(66.9608, 83.4816, 31.3211) |
| Luminance | 0.8348 (WCAG relative) |
| Temperature | warm |
| Family | yellow-green |
Closest named colors
Pear
#CBF85F
ΔE00 4.03
Light Yellow Green
#CCFD7F
ΔE00 4.42
Yellowish Tan
#FCFC81
ΔE00 5.82
Faded Yellow
#FEFF7F
ΔE00 5.94
Light Pea Green
#C4FE82
ΔE00 5.99
Pale Yellow
#FFFF84
ΔE00 6.04
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#DEF77B #947BF7
analogous
#F7D27B #DEF77B #A0F77B
triadic
#DEF77B #7BDEF7 #F77BDE
tetradic
#DEF77B #7BF7D2 #947BF7 #F77BA0
square
#DEF77B #7BF7D2 #947BF7 #F77BA0
split-complementary
#DEF77B #7BA0F7 #D27BF7
monochromatic
#BDE90E #D0F441 #DEF77B #ECFAB5 #F8FDE2
Accessibility & contrast
On white
1.19
#DEF77B on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
17.70
#DEF77B on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #DEF77B
17.70:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##DEF77B | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##DEF77B | 1.00 | 1.19 | 17.70 | 17.70 |
| #FFFFFF | 1.19 | 1.00 | 21.00 | 21.00 |
| #000000 | 17.70 | 21.00 | 1.00 | 1.00 |
| ##000000 | 17.70 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#FFEB70
Deuteranopia (green-blind)
#FFEC82
Tritanopia (blue-blind)
#E8ECDB
Achromatopsia (no color)
#ECECEC
Design tokens & code
CSS
--color: #def77b; /* rgb */ color: rgb(222, 247, 123); /* oklch */ color: oklch(93.3% 0.152 118.9);
Tailwind
colors: {
custom: {
50: '#eaf9a4',
500: '#def77b',
950: '#000000',
},
}SCSS
$custom: #def77b; $custom-light: #eaf9a4; $custom-dark: #000000;
JSON
{
"hex": "#def77b",
"rgb": {
"r": 222,
"g": 247,
"b": 123
},
"hsl": {
"h": 72.097,
"s": 88.571,
"l": 72.549
},
"oklch": {
"l": 0.93261,
"c": 0.15222,
"h": 118.9
},
"luminance": 0.83481
}Semantic roles & 50–950 ramp
primary
#DEF77B
secondary
#6043D3
accent
#00E52E
background
#FFFFFC
surface
#FEFFF6
border
#D6D7D0
text
#16170F
muted
#858580