#778418#778418
#778418 is a mid, vivid yellow. Relative luminance 0.205; OKLCH L 58.3% C 0.126 H 116.7°. Best body text is #000000 at 5.10:1 contrast (WCAG AA passes).
Color values
| HEX | #778418 |
|---|---|
| RGB | rgb(119, 132, 24) |
| HSL | hsl(67, 69%, 31%) |
| HSV | hsv(67, 82%, 52%) |
| CMYK | cmyk(9.8%, 0%, 81.8%, 48.2%) |
| CIE-LAB | lab(52.39, -18.56, 51.56) |
| CIE-LCH | lch(52.39, 54.80, 109.79°) |
| OKLab | oklab(58.32% -0.0565 0.1123) |
| OKLCH | oklch(58.32% 0.126 116.7) |
| XYZ | xyz(16.0243, 20.4906, 3.9749) |
| Luminance | 0.2049 (WCAG relative) |
| Temperature | warm |
| Family | yellow |
Closest named colors
Swamp Green
#748500
ΔE00 1.60
Shit Green
#758000
ΔE00 2.04
Poop Green
#6F7C00
ΔE00 3.24
Murky Green
#6C7A0E
ΔE00 3.97
Olive
#808000
ΔE00 4.18
Olive Green
#677A04
ΔE00 4.57
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#778418 #251884
analogous
#845B18 #778418 #418418
triadic
#778418 #187784 #841877
tetradic
#778418 #18845B #251884 #841841
square
#778418 #18845B #251884 #841841
split-complementary
#778418 #184184 #5B1884
monochromatic
#1A1C05 #48500F #778418 #A6B821 #C8DB3B
Accessibility & contrast
On white
4.12
#778418 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.10
#778418 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #778418
5.10:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##778418 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##778418 | 1.00 | 4.12 | 5.10 | 5.10 |
| #FFFFFF | 4.12 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.10 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.10 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#8E7D00
Deuteranopia (green-blind)
#8C7E23
Tritanopia (blue-blind)
#7F7C70
Achromatopsia (no color)
#7D7D7D
Design tokens & code
CSS
--color: #778418; /* rgb */ color: rgb(119, 132, 24); /* oklch */ color: oklch(58.3% 0.126 116.7);
Tailwind
colors: {
custom: {
50: '#a2a760',
500: '#778418',
950: '#000000',
},
}SCSS
$custom: #778418; $custom-light: #a2a760; $custom-dark: #000000;
JSON
{
"hex": "#778418",
"rgb": {
"r": 119,
"g": 132,
"b": 24
},
"hsl": {
"h": 67.222,
"s": 69.231,
"l": 30.588
},
"oklch": {
"l": 0.58321,
"c": 0.12573,
"h": 116.7
},
"luminance": 0.2049
}Semantic roles & 50–950 ramp
primary
#778418
secondary
#4E40B8
accent
#3CEC51
background
#FAFAF5
surface
#F4F4EA
border
#CECEC6
text
#0F0F05
muted
#7F7F79