#78B78E#78B78E
#78B78E is a light, moderate green. Relative luminance 0.398; OKLCH L 72.5% C 0.088 H 155.0°. Best body text is #000000 at 8.96:1 contrast (WCAG AA passes).
Color values
| HEX | #78B78E |
|---|---|
| RGB | rgb(120, 183, 142) |
| HSL | hsl(141, 30%, 59%) |
| HSV | hsv(141, 34%, 72%) |
| CMYK | cmyk(34.4%, 0%, 22.4%, 28.2%) |
| CIE-LAB | lab(69.34, -29.06, 14.56) |
| CIE-LCH | lch(69.34, 32.51, 153.40°) |
| OKLab | oklab(72.53% -0.0801 0.0373) |
| OKLCH | oklch(72.53% 0.088 155) |
| XYZ | xyz(29.5599, 39.8115, 31.7128) |
| Luminance | 0.3981 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Closest named colors
Darkseagreen
#8FBC8F
ΔE00 4.24
Tea
#65AB7C
ΔE00 4.34
Dusty Green
#76A973
ΔE00 5.95
Faded Green
#7BB274
ΔE00 5.97
Greyish Green
#82A67D
ΔE00 6.38
Sage Green (survey)
#88B378
ΔE00 6.57
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#78B78E #B778A1
analogous
#82B778 #78B78E #78B7AE
triadic
#78B78E #8E78B7 #B78E78
tetradic
#78B78E #7882B7 #B778A1 #B7AE78
square
#78B78E #7882B7 #B778A1 #B7AE78
split-complementary
#78B78E #AE78B7 #B77882
monochromatic
#3F7652 #549E6E #78B78E #A0CCAF #C8E2D1
Accessibility & contrast
On white
2.34
#78B78E on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.96
#78B78E on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #78B78E
8.96:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##78B78E | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##78B78E | 1.00 | 2.34 | 8.96 | 8.96 |
| #FFFFFF | 2.34 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.96 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.96 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#B7AE8C
Deuteranopia (green-blind)
#ACA790
Tritanopia (blue-blind)
#6CB6AC
Achromatopsia (no color)
#A9A9A9
Design tokens & code
CSS
--color: #78b78e; /* rgb */ color: rgb(120, 183, 142); /* oklch */ color: oklch(72.5% 0.088 155.0);
Tailwind
colors: {
custom: {
50: '#a1cdaf',
500: '#78b78e',
950: '#000000',
},
}SCSS
$custom: #78b78e; $custom-light: #a1cdaf; $custom-dark: #000000;
JSON
{
"hex": "#78b78e",
"rgb": {
"r": 120,
"g": 183,
"b": 142
},
"hsl": {
"h": 140.952,
"s": 30.435,
"l": 59.412
},
"oklch": {
"l": 0.72528,
"c": 0.08839,
"h": 155
},
"luminance": 0.39813
}Semantic roles & 50–950 ramp
primary
#78B78E
secondary
#D2B9C9
accent
#61A3C7
background
#FAFCFA
surface
#F3F9F4
border
#CDD2CE
text
#0F1310
muted
#7F827F