light khaki
On white 1.19:1 · Fail
On black 17.59:1 · AAA
Olive & yellow-green Colors
Names, HEX, RGB & Contrast
136 named olive & yellow-green colors, grouped by lightness. Click any value to copy it.
Light
12 colors
celery
On white 1.18:1 · Fail
On black 17.75:1 · AAA
light yellowish green
On white 1.17:1 · Fail
On black 17.96:1 · AAA
pistachio
On white 1.21:1 · Fail
On black 17.29:1 · AAA
light grey green
On white 1.47:1 · Fail
On black 14.3:1 · AAA
light pea green
On white 1.18:1 · Fail
On black 17.85:1 · AAA
light yellow green
On white 1.17:1 · Fail
On black 17.92:1 · AAA
pale lime
On white 1.2:1 · Fail
On black 17.49:1 · AAA
key lime
On white 1.21:1 · Fail
On black 17.33:1 · AAA
spring green
On white 1.27:1 · Fail
On black 16.48:1 · AAA
light lime
On white 1.23:1 · Fail
On black 17.07:1 · AAA
light lime green
On white 1.2:1 · Fail
On black 17.56:1 · AAA
Mid-tone
80 colors
greenyellow
CSS keyword
On white 1.23:1 · Fail
On black 17.12:1 · AAA
chartreuse
CSS keyword
On white 1.3:1 · Fail
On black 16.21:1 · AAA
yellowgreen
CSS keyword
On white 1.88:1 · Fail
On black 11.15:1 · AAA
lawngreen
CSS keyword
On white 1.33:1 · Fail
On black 15.78:1 · AAA
pale lime green
On white 1.21:1 · Fail
On black 17.36:1 · AAA
light grass green
On white 1.32:1 · Fail
On black 15.86:1 · AAA
pear
On white 1.23:1 · Fail
On black 17.13:1 · AAA
pale olive green
On white 1.7:1 · Fail
On black 12.37:1 · AAA
pale olive
On white 1.75:1 · Fail
On black 12.02:1 · AAA
greenish beige
On white 1.63:1 · Fail
On black 12.88:1 · AAA
greenish tan
On white 1.76:1 · Fail
On black 11.96:1 · AAA
light moss green
On white 1.89:1 · Fail
On black 11.14:1 · AAA
yellow/green
On white 1.19:1 · Fail
On black 17.57:1 · AAA
kiwi
On white 1.41:1 · Fail
On black 14.84:1 · AAA
lichen
On white 2.3:1 · Fail
On black 9.15:1 · AAA
tan green
On white 2.04:1 · Fail
On black 10.29:1 · AAA
light olive
On white 2.02:1 · Fail
On black 10.41:1 · AAA
yellow green
On white 1.23:1 · Fail
On black 17.08:1 · AAA
lemon lime
On white 1.21:1 · Fail
On black 17.42:1 · AAA
green yellow
On white 1.18:1 · Fail
On black 17.82:1 · AAA
kiwi green
On white 1.56:1 · Fail
On black 13.43:1 · AAA
sage
On white 2.52:1 · Fail
On black 8.33:1 · AAA
lime yellow
On white 1.17:1 · Fail
On black 17.88:1 · AAA
light olive green
On white 2.08:1 · Fail
On black 10.1:1 · AAA
yellowy green
On white 1.33:1 · Fail
On black 15.83:1 · AAA
sickly yellow
On white 1.42:1 · Fail
On black 14.81:1 · AAA
turtle green
On white 2.41:1 · Fail
On black 8.73:1 · AAA
apple
On white 2.04:1 · Fail
On black 10.27:1 · AAA
acid green
On white 1.28:1 · Fail
On black 16.35:1 · AAA
bright lime green
On white 1.33:1 · Fail
On black 15.73:1 · AAA
electric lime
On white 1.24:1 · Fail
On black 16.97:1 · AAA
neon yellow
On white 1.17:1 · Fail
On black 17.96:1 · AAA
lime green
On white 1.29:1 · Fail
On black 16.24:1 · AAA
bright lime
On white 1.31:1 · Fail
On black 16.08:1 · AAA
asparagus
On white 2.71:1 · Fail
On black 7.74:1 · AAA
greeny yellow
On white 1.25:1 · Fail
On black 16.83:1 · AAA
bright yellow green
On white 1.25:1 · Fail
On black 16.74:1 · AAA
greenish yellow
On white 1.19:1 · Fail
On black 17.65:1 · AAA
lemon green
On white 1.3:1 · Fail
On black 16.2:1 · AAA
apple green
On white 1.99:1 · Fail
On black 10.53:1 · AAA
yellowish green
On white 1.59:1 · Fail
On black 13.2:1 · AAA
nasty green
On white 2.58:1 · Fail
On black 8.13:1 · AAA
booger
On white 2.32:1 · Fail
On black 9.07:1 · AAA
moss
On white 3.25:1 · AA Large
On black 6.47:1 · AA
flat green
On white 3.22:1 · AA Large
On black 6.53:1 · AA
drab green
On white 3.41:1 · AA Large
On black 6.16:1 · AA
sick green
On white 2.23:1 · Fail
On black 9.41:1 · AAA
avocado
On white 2.46:1 · Fail
On black 8.52:1 · AAA
pea
On white 2.09:1 · Fail
On black 10.05:1 · AAA
leaf
On white 2.8:1 · Fail
On black 7.5:1 · AAA
camo
On white 3.53:1 · AA Large
On black 5.94:1 · AA
grass
On white 2.84:1 · Fail
On black 7.39:1 · AAA
green/yellow
On white 1.78:1 · Fail
On black 11.8:1 · AAA
gross green
On white 2.11:1 · Fail
On black 9.96:1 · AAA
icky green
On white 2.55:1 · Fail
On black 8.25:1 · AAA
slime green
On white 1.91:1 · Fail
On black 10.99:1 · AAA
sickly green
On white 2.43:1 · Fail
On black 8.64:1 · AAA
olive yellow
On white 2.09:1 · Fail
On black 10.07:1 · AAA
avocado green
On white 2.72:1 · Fail
On black 7.73:1 · AAA
baby puke green
On white 1.93:1 · Fail
On black 10.89:1 · AAA
bile
On white 1.95:1 · Fail
On black 10.77:1 · AAA
snot
On white 2.13:1 · Fail
On black 9.87:1 · AAA
drab
On white 3.98:1 · AA Large
On black 5.28:1 · AA
muddy yellow
On white 2.3:1 · Fail
On black 9.12:1 · AAA
frog green
On white 2.44:1 · Fail
On black 8.61:1 · AAA
moss green
On white 3.96:1 · AA Large
On black 5.3:1 · AA
snot green
On white 2.09:1 · Fail
On black 10.06:1 · AAA
bright olive
On white 2.21:1 · Fail
On black 9.52:1 · AAA
khaki green
On white 4.05:1 · AA Large
On black 5.18:1 · AA
dark lime green
On white 2.29:1 · Fail
On black 9.17:1 · AAA
pea soup green
On white 2.72:1 · Fail
On black 7.73:1 · AAA
pea green
On white 2.63:1 · Fail
On black 7.98:1 · AAA
swamp
On white 4.28:1 · AA Large
On black 4.91:1 · AA
military green
On white 4.65:1 · AA
On black 4.52:1 · AA
mustard green
On white 2.26:1 · Fail
On black 9.28:1 · AAA
vomit
On white 2.67:1 · Fail
On black 7.86:1 · AAA
dark lime
On white 2.4:1 · Fail
On black 8.75:1 · AAA
booger green
On white 2.38:1 · Fail
On black 8.83:1 · AAA
brown yellow
On white 2.87:1 · Fail
On black 7.32:1 · AAA
puke green
On white 2.49:1 · Fail
On black 8.43:1 · AAA
Dark
44 colors
olivedrab
CSS keyword
On white 3.81:1 · AA Large
On black 5.52:1 · AA
darkolivegreen
CSS keyword
On white 5.95:1 · AA
On black 3.53:1 · AA Large
olive
CSS keyword
On white 4.2:1 · AA Large
On black 5.01:1 · AA
mossy green
On white 4:1 · AA Large
On black 5.25:1 · AA
kermit green
On white 2.68:1 · Fail
On black 7.82:1 · AAA
baby poo
On white 3.12:1 · AA Large
On black 6.72:1 · AA
barf green
On white 2.57:1 · Fail
On black 8.16:1 · AAA
baby shit green
On white 3.24:1 · AA Large
On black 6.49:1 · AA
lawn green
On white 3.17:1 · AA Large
On black 6.63:1 · AA
leaf green
On white 2.94:1 · Fail
On black 7.13:1 · AAA
dirty green
On white 4.58:1 · AA
On black 4.59:1 · AA
olive drab
On white 4.87:1 · AA
On black 4.31:1 · AA Large
puke
On white 2.63:1 · Fail
On black 7.98:1 · AAA
muddy green
On white 5.13:1 · AA
On black 4.1:1 · AA Large
grass green
On white 3.56:1 · AA Large
On black 5.9:1 · AA
vomit green
On white 2.9:1 · Fail
On black 7.23:1 · AAA
sap green
On white 4.07:1 · AA Large
On black 5.16:1 · AA
grassy green
On white 3.51:1 · AA Large
On black 5.98:1 · AA
baby poop green
On white 3.15:1 · AA Large
On black 6.66:1 · AA
pea soup
On white 3.1:1 · AA Large
On black 6.78:1 · AA
ugly green
On white 3.36:1 · AA Large
On black 6.26:1 · AA
baby poop
On white 4.1:1 · AA Large
On black 5.12:1 · AA
dark yellow green
On white 3.72:1 · AA Large
On black 5.65:1 · AA
camo green
On white 6.47:1 · AA
On black 3.25:1 · AA Large
murky green
On white 4.74:1 · AA
On black 4.43:1 · AA Large
swamp green
On white 4.12:1 · AA Large
On black 5.1:1 · AA
dark grass green
On white 4.93:1 · AA
On black 4.26:1 · AA Large
brown green
On white 5.47:1 · AA
On black 3.84:1 · AA Large
ugly brown
On white 4.96:1 · AA
On black 4.24:1 · AA Large
shit green
On white 4.34:1 · AA Large
On black 4.84:1 · AA
olive green
On white 4.81:1 · AA
On black 4.36:1 · AA Large
poop green
On white 4.61:1 · AA
On black 4.56:1 · AA
greenish brown
On white 6.33:1 · AA
On black 3.32:1 · AA Large
browny green
On white 5.49:1 · AA
On black 3.83:1 · AA Large
brownish green
On white 5.46:1 · AA
On black 3.85:1 · AA Large
camouflage green
On white 6.96:1 · AA
On black 3.02:1 · AA Large
army green
On white 7.3:1 · AAA
On black 2.88:1 · Fail
greeny brown
On white 6.41:1 · AA
On black 3.28:1 · AA Large
mud green
On white 6.18:1 · AA
On black 3.4:1 · AA Large
olive brown
On white 7.47:1 · AAA
On black 2.81:1 · Fail
navy green
On white 8.78:1 · AAA
On black 2.39:1 · Fail
green brown
On white 8.51:1 · AAA
On black 2.47:1 · Fail
dark olive green
On white 9.31:1 · AAA
On black 2.25:1 · Fail
dark olive
On white 11.34:1 · AAA
On black 1.85:1 · Fail
Copy the whole palette
Every olive & yellow-green color on this page, ready to paste into your project.
CSS
:root {
--greenyellow: #adff2f;
--chartreuse: #7fff00;
--yellowgreen: #9acd32;
--lawngreen: #7cfc00;
--olivedrab: #6b8e23;
--darkolivegreen: #556b2f;
--olive: #808000;
--light-khaki: #e6f2a2;
--celery: #c1fd95;
--light-yellowish-green: #c2ff89;
--pistachio: #c0fa8b;
--light-grey-green: #b7e1a1;
--light-pea-green: #c4fe82;
--light-yellow-green: #ccfd7f;
--pale-lime: #befd73;
--key-lime: #aeff6e;
--spring-green: #a9f971;
--light-lime: #aefd6c;
--light-lime-green: #b9ff66;
--pale-lime-green: #b1ff65;
--light-grass-green: #9af764;
--pear: #cbf85f;
--pale-olive-green: #b1d27b;
--pale-olive: #b9cc81;
--greenish-beige: #c9d179;
--greenish-tan: #bccb7a;
--light-moss-green: #a6c875;
--yellow-green: #c8fd3d;
--kiwi: #9cef43;
--lichen: #8fb67b;
--tan-green: #a9be70;
--light-olive: #acbf69;
--yellow-green: #c0fb2d;
--lemon-lime: #bffe28;
--green-yellow: #c9ff27;
--kiwi-green: #8ee53f;
--sage: #87ae73;
--lime-yellow: #d0fe1d;
--light-olive-green: #a4be5c;
--yellowy-green: #bff128;
--sickly-yellow: #d0e429;
--turtle-green: #75b84f;
--apple: #6ecb3c;
--acid-green: #8ffe09;
--bright-lime-green: #65fe08;
--electric-lime: #a8ff04;
--neon-yellow: #cfff04;
--lime-green: #89fe05;
--bright-lime: #87fd05;
--asparagus: #77ab56;
--greeny-yellow: #c6f808;
--bright-yellow-green: #9dff00;
--greenish-yellow: #cdfd02;
--lemon-green: #adf802;
--apple-green: #76cd26;
--yellowish-green: #b0dd16;
--nasty-green: #70b23f;
--booger: #9bb53c;
--moss: #769958;
--flat-green: #699d4c;
--drab-green: #749551;
--sick-green: #9db92c;
--avocado: #90b134;
--pea: #a4bf20;
--leaf: #71aa34;
--camo: #7f8f4e;
--grass: #5cac2d;
--green-yellow: #b5ce08;
--gross-green: #a0bf16;
--icky-green: #8fae22;
--slime-green: #99cc04;
--sickly-green: #94b21c;
--olive-yellow: #c2b709;
--avocado-green: #87a922;
--baby-puke-green: #b6c406;
--bile: #b5c306;
--snot: #acbb0d;
--drab: #828344;
--muddy-yellow: #bfac05;
--frog-green: #58bc08;
--moss-green: #658b38;
--snot-green: #9dc100;
--bright-olive: #9cbb04;
--khaki-green: #728639;
--dark-lime-green: #7ebd01;
--pea-soup-green: #94a617;
--pea-green: #8eab12;
--swamp: #698339;
--military-green: #667c3e;
--mustard-green: #a8b504;
--vomit: #a2a415;
--dark-lime: #84b701;
--booger-green: #96b403;
--brown-yellow: #b29705;
--puke-green: #9aae07;
--mossy-green: #638b27;
--kermit-green: #5cb200;
--baby-poo: #ab9004;
--barf-green: #94ac02;
--baby-shit-green: #889717;
--lawn-green: #4da409;
--leaf-green: #5ca904;
--dirty-green: #667e2c;
--olive-drab: #6f7632;
--puke: #a5a502;
--muddy-green: #657432;
--grass-green: #3f9b0b;
--vomit-green: #89a203;
--sap-green: #5c8b15;
--grassy-green: #419c03;
--baby-poop-green: #8f9805;
--pea-soup: #929901;
--ugly-green: #7a9703;
--baby-poop: #937c00;
--dark-yellow-green: #728f02;
--camo-green: #526525;
--murky-green: #6c7a0e;
--swamp-green: #748500;
--dark-grass-green: #388004;
--brown-green: #706c11;
--ugly-brown: #7d7103;
--shit-green: #758000;
--olive-green: #677a04;
--poop-green: #6f7c00;
--greenish-brown: #696112;
--browny-green: #6f6c0a;
--brownish-green: #6a6e09;
--camouflage-green: #4b6113;
--army-green: #4b5d16;
--greeny-brown: #696006;
--mud-green: #606602;
--olive-brown: #645403;
--navy-green: #35530a;
--green-brown: #544e03;
--dark-olive-green: #3c4d03;
--dark-olive: #373e02;
} SCSS
$greenyellow: #adff2f; $chartreuse: #7fff00; $yellowgreen: #9acd32; $lawngreen: #7cfc00; $olivedrab: #6b8e23; $darkolivegreen: #556b2f; $olive: #808000; $light-khaki: #e6f2a2; $celery: #c1fd95; $light-yellowish-green: #c2ff89; $pistachio: #c0fa8b; $light-grey-green: #b7e1a1; $light-pea-green: #c4fe82; $light-yellow-green: #ccfd7f; $pale-lime: #befd73; $key-lime: #aeff6e; $spring-green: #a9f971; $light-lime: #aefd6c; $light-lime-green: #b9ff66; $pale-lime-green: #b1ff65; $light-grass-green: #9af764; $pear: #cbf85f; $pale-olive-green: #b1d27b; $pale-olive: #b9cc81; $greenish-beige: #c9d179; $greenish-tan: #bccb7a; $light-moss-green: #a6c875; $yellow-green: #c8fd3d; $kiwi: #9cef43; $lichen: #8fb67b; $tan-green: #a9be70; $light-olive: #acbf69; $yellow-green: #c0fb2d; $lemon-lime: #bffe28; $green-yellow: #c9ff27; $kiwi-green: #8ee53f; $sage: #87ae73; $lime-yellow: #d0fe1d; $light-olive-green: #a4be5c; $yellowy-green: #bff128; $sickly-yellow: #d0e429; $turtle-green: #75b84f; $apple: #6ecb3c; $acid-green: #8ffe09; $bright-lime-green: #65fe08; $electric-lime: #a8ff04; $neon-yellow: #cfff04; $lime-green: #89fe05; $bright-lime: #87fd05; $asparagus: #77ab56; $greeny-yellow: #c6f808; $bright-yellow-green: #9dff00; $greenish-yellow: #cdfd02; $lemon-green: #adf802; $apple-green: #76cd26; $yellowish-green: #b0dd16; $nasty-green: #70b23f; $booger: #9bb53c; $moss: #769958; $flat-green: #699d4c; $drab-green: #749551; $sick-green: #9db92c; $avocado: #90b134; $pea: #a4bf20; $leaf: #71aa34; $camo: #7f8f4e; $grass: #5cac2d; $green-yellow: #b5ce08; $gross-green: #a0bf16; $icky-green: #8fae22; $slime-green: #99cc04; $sickly-green: #94b21c; $olive-yellow: #c2b709; $avocado-green: #87a922; $baby-puke-green: #b6c406; $bile: #b5c306; $snot: #acbb0d; $drab: #828344; $muddy-yellow: #bfac05; $frog-green: #58bc08; $moss-green: #658b38; $snot-green: #9dc100; $bright-olive: #9cbb04; $khaki-green: #728639; $dark-lime-green: #7ebd01; $pea-soup-green: #94a617; $pea-green: #8eab12; $swamp: #698339; $military-green: #667c3e; $mustard-green: #a8b504; $vomit: #a2a415; $dark-lime: #84b701; $booger-green: #96b403; $brown-yellow: #b29705; $puke-green: #9aae07; $mossy-green: #638b27; $kermit-green: #5cb200; $baby-poo: #ab9004; $barf-green: #94ac02; $baby-shit-green: #889717; $lawn-green: #4da409; $leaf-green: #5ca904; $dirty-green: #667e2c; $olive-drab: #6f7632; $puke: #a5a502; $muddy-green: #657432; $grass-green: #3f9b0b; $vomit-green: #89a203; $sap-green: #5c8b15; $grassy-green: #419c03; $baby-poop-green: #8f9805; $pea-soup: #929901; $ugly-green: #7a9703; $baby-poop: #937c00; $dark-yellow-green: #728f02; $camo-green: #526525; $murky-green: #6c7a0e; $swamp-green: #748500; $dark-grass-green: #388004; $brown-green: #706c11; $ugly-brown: #7d7103; $shit-green: #758000; $olive-green: #677a04; $poop-green: #6f7c00; $greenish-brown: #696112; $browny-green: #6f6c0a; $brownish-green: #6a6e09; $camouflage-green: #4b6113; $army-green: #4b5d16; $greeny-brown: #696006; $mud-green: #606602; $olive-brown: #645403; $navy-green: #35530a; $green-brown: #544e03; $dark-olive-green: #3c4d03; $dark-olive: #373e02;
Tailwind
theme: {
extend: {
colors: {
"greenyellow": "#adff2f",
"chartreuse": "#7fff00",
"yellowgreen": "#9acd32",
"lawngreen": "#7cfc00",
"olivedrab": "#6b8e23",
"darkolivegreen": "#556b2f",
"olive": "#808000",
"light-khaki": "#e6f2a2",
"celery": "#c1fd95",
"light-yellowish-green": "#c2ff89",
"pistachio": "#c0fa8b",
"light-grey-green": "#b7e1a1",
"light-pea-green": "#c4fe82",
"light-yellow-green": "#ccfd7f",
"pale-lime": "#befd73",
"key-lime": "#aeff6e",
"spring-green": "#a9f971",
"light-lime": "#aefd6c",
"light-lime-green": "#b9ff66",
"pale-lime-green": "#b1ff65",
"light-grass-green": "#9af764",
"pear": "#cbf85f",
"pale-olive-green": "#b1d27b",
"pale-olive": "#b9cc81",
"greenish-beige": "#c9d179",
"greenish-tan": "#bccb7a",
"light-moss-green": "#a6c875",
"yellow-green": "#c8fd3d",
"kiwi": "#9cef43",
"lichen": "#8fb67b",
"tan-green": "#a9be70",
"light-olive": "#acbf69",
"yellow-green": "#c0fb2d",
"lemon-lime": "#bffe28",
"green-yellow": "#c9ff27",
"kiwi-green": "#8ee53f",
"sage": "#87ae73",
"lime-yellow": "#d0fe1d",
"light-olive-green": "#a4be5c",
"yellowy-green": "#bff128",
"sickly-yellow": "#d0e429",
"turtle-green": "#75b84f",
"apple": "#6ecb3c",
"acid-green": "#8ffe09",
"bright-lime-green": "#65fe08",
"electric-lime": "#a8ff04",
"neon-yellow": "#cfff04",
"lime-green": "#89fe05",
"bright-lime": "#87fd05",
"asparagus": "#77ab56",
"greeny-yellow": "#c6f808",
"bright-yellow-green": "#9dff00",
"greenish-yellow": "#cdfd02",
"lemon-green": "#adf802",
"apple-green": "#76cd26",
"yellowish-green": "#b0dd16",
"nasty-green": "#70b23f",
"booger": "#9bb53c",
"moss": "#769958",
"flat-green": "#699d4c",
"drab-green": "#749551",
"sick-green": "#9db92c",
"avocado": "#90b134",
"pea": "#a4bf20",
"leaf": "#71aa34",
"camo": "#7f8f4e",
"grass": "#5cac2d",
"green-yellow": "#b5ce08",
"gross-green": "#a0bf16",
"icky-green": "#8fae22",
"slime-green": "#99cc04",
"sickly-green": "#94b21c",
"olive-yellow": "#c2b709",
"avocado-green": "#87a922",
"baby-puke-green": "#b6c406",
"bile": "#b5c306",
"snot": "#acbb0d",
"drab": "#828344",
"muddy-yellow": "#bfac05",
"frog-green": "#58bc08",
"moss-green": "#658b38",
"snot-green": "#9dc100",
"bright-olive": "#9cbb04",
"khaki-green": "#728639",
"dark-lime-green": "#7ebd01",
"pea-soup-green": "#94a617",
"pea-green": "#8eab12",
"swamp": "#698339",
"military-green": "#667c3e",
"mustard-green": "#a8b504",
"vomit": "#a2a415",
"dark-lime": "#84b701",
"booger-green": "#96b403",
"brown-yellow": "#b29705",
"puke-green": "#9aae07",
"mossy-green": "#638b27",
"kermit-green": "#5cb200",
"baby-poo": "#ab9004",
"barf-green": "#94ac02",
"baby-shit-green": "#889717",
"lawn-green": "#4da409",
"leaf-green": "#5ca904",
"dirty-green": "#667e2c",
"olive-drab": "#6f7632",
"puke": "#a5a502",
"muddy-green": "#657432",
"grass-green": "#3f9b0b",
"vomit-green": "#89a203",
"sap-green": "#5c8b15",
"grassy-green": "#419c03",
"baby-poop-green": "#8f9805",
"pea-soup": "#929901",
"ugly-green": "#7a9703",
"baby-poop": "#937c00",
"dark-yellow-green": "#728f02",
"camo-green": "#526525",
"murky-green": "#6c7a0e",
"swamp-green": "#748500",
"dark-grass-green": "#388004",
"brown-green": "#706c11",
"ugly-brown": "#7d7103",
"shit-green": "#758000",
"olive-green": "#677a04",
"poop-green": "#6f7c00",
"greenish-brown": "#696112",
"browny-green": "#6f6c0a",
"brownish-green": "#6a6e09",
"camouflage-green": "#4b6113",
"army-green": "#4b5d16",
"greeny-brown": "#696006",
"mud-green": "#606602",
"olive-brown": "#645403",
"navy-green": "#35530a",
"green-brown": "#544e03",
"dark-olive-green": "#3c4d03",
"dark-olive": "#373e02",
}
}
} Browse other color families
Copied
Olive & yellow-green color names
Olive and yellow-green cover hue 65–100°, plus the darker end of yellow — the stretch between yellow and true green that holds chartreuse, olive, sage and olive drab. Separating it matters because green otherwise spans a hundred degrees of hue and lumps very different colours together.
Using these colors
The bright end of this range reads as fresh, digital and slightly artificial — the natural home of highlight states and ‘new’ badges. The muted end, olive and sage, does the opposite: calm and organic, working beautifully with terracotta, cream and warm greys. The two ends rarely belong in the same palette.
Contrast and accessibility
Bright yellow-greens sit close to yellow in luminance and fail badly as text on white. The olive and sage tones are far safer and often pass AA on light backgrounds. As with every green family, do not rely on green-versus-red alone to convey state.