Monochrome Green Color Palette
Thirty even steps of one green, pale celadon down to deep pine-black. A clean monochromatic value scale for foliage shading, eco and wellness branding, or any design that wants depth from a single hue. Every swatch relates to every other, so gradients and tints fall out for free.
Get Paintrix free on the App Store.
Download
Hex codes
Color theory
Base
Complement
Analogous −30°
Analogous +30°
Triadic
Use it for
Code formats
CSS
:root {
--mono-green-1: #EEF7EE;
--mono-green-2: #E1F0E1;
--mono-green-3: #D4E9D4;
--mono-green-4: #C7E2C7;
--mono-green-5: #BADBBA;
--mono-green-6: #ADD4AD;
--mono-green-7: #9FCC9F;
--mono-green-8: #92C492;
--mono-green-9: #85BC85;
--mono-green-10: #78B478;
--mono-green-11: #6BAC6B;
--mono-green-12: #5FA25F;
--mono-green-13: #549854;
--mono-green-14: #4A8E4A;
--mono-green-15: #418441;
--mono-green-16: #387A38;
--mono-green-17: #307030;
--mono-green-18: #286528;
--mono-green-19: #225B22;
--mono-green-20: #1C511C;
--mono-green-21: #174717;
--mono-green-22: #123D12;
--mono-green-23: #0E330E;
--mono-green-24: #0A2A0A;
--mono-green-25: #072007;
--mono-green-26: #051705;
--mono-green-27: #040F04;
--mono-green-28: #030A03;
--mono-green-29: #020602;
--mono-green-30: #010301;
} SCSS
$mono-green-1: #EEF7EE;
$mono-green-2: #E1F0E1;
$mono-green-3: #D4E9D4;
$mono-green-4: #C7E2C7;
$mono-green-5: #BADBBA;
$mono-green-6: #ADD4AD;
$mono-green-7: #9FCC9F;
$mono-green-8: #92C492;
$mono-green-9: #85BC85;
$mono-green-10: #78B478;
$mono-green-11: #6BAC6B;
$mono-green-12: #5FA25F;
$mono-green-13: #549854;
$mono-green-14: #4A8E4A;
$mono-green-15: #418441;
$mono-green-16: #387A38;
$mono-green-17: #307030;
$mono-green-18: #286528;
$mono-green-19: #225B22;
$mono-green-20: #1C511C;
$mono-green-21: #174717;
$mono-green-22: #123D12;
$mono-green-23: #0E330E;
$mono-green-24: #0A2A0A;
$mono-green-25: #072007;
$mono-green-26: #051705;
$mono-green-27: #040F04;
$mono-green-28: #030A03;
$mono-green-29: #020602;
$mono-green-30: #010301; Tailwind
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'mono-green': {
'1': '#EEF7EE',
'2': '#E1F0E1',
'3': '#D4E9D4',
'4': '#C7E2C7',
'5': '#BADBBA',
'6': '#ADD4AD',
'7': '#9FCC9F',
'8': '#92C492',
'9': '#85BC85',
'10': '#78B478',
'11': '#6BAC6B',
'12': '#5FA25F',
'13': '#549854',
'14': '#4A8E4A',
'15': '#418441',
'16': '#387A38',
'17': '#307030',
'18': '#286528',
'19': '#225B22',
'20': '#1C511C',
'21': '#174717',
'22': '#123D12',
'23': '#0E330E',
'24': '#0A2A0A',
'25': '#072007',
'26': '#051705',
'27': '#040F04',
'28': '#030A03',
'29': '#020602',
'30': '#010301',
},
},
},
},
}; JSON
{
"name": "Monochrome Green",
"colors": [
"#EEF7EE",
"#E1F0E1",
"#D4E9D4",
"#C7E2C7",
"#BADBBA",
"#ADD4AD",
"#9FCC9F",
"#92C492",
"#85BC85",
"#78B478",
"#6BAC6B",
"#5FA25F",
"#549854",
"#4A8E4A",
"#418441",
"#387A38",
"#307030",
"#286528",
"#225B22",
"#1C511C",
"#174717",
"#123D12",
"#0E330E",
"#0A2A0A",
"#072007",
"#051705",
"#040F04",
"#030A03",
"#020602",
"#010301"
]
} Hex list
#EEF7EE
#E1F0E1
#D4E9D4
#C7E2C7
#BADBBA
#ADD4AD
#9FCC9F
#92C492
#85BC85
#78B478
#6BAC6B
#5FA25F
#549854
#4A8E4A
#418441
#387A38
#307030
#286528
#225B22
#1C511C
#174717
#123D12
#0E330E
#0A2A0A
#072007
#051705
#040F04
#030A03
#020602
#010301