← Back to Tools
Lock geometric relationships between organic green and warm clay hues, binding a rich mossy sage (#708238) with a striking, sun-baked clay terracotta (#D96B43).
Export
Copy or download this palette as CSS, SCSS, Tailwind config, JSON, CSV, GPL, ASE or ACO.
:root {
--rich-mossy-sage: #708238;
--rich-mossy-sage-50: #fbfdf6;
--rich-mossy-sage-100: #f6f9ed;
--rich-mossy-sage-200: #edf2dc;
--rich-mossy-sage-300: #e0e7c6;
--rich-mossy-sage-400: #cfd9aa;
--rich-mossy-sage-500: #708238;
--rich-mossy-sage-600: #94a068;
--rich-mossy-sage-700: #677041;
--rich-mossy-sage-800: #3e441f;
--rich-mossy-sage-900: #1c2008;
--rich-mossy-sage-950: #040501;
--sun-baked-clay-terracotta: #D96B43;
--sun-baked-clay-terracotta-50: #fffbf6;
--sun-baked-clay-terracotta-100: #fff5ee;
--sun-baked-clay-terracotta-200: #ffebdf;
--sun-baked-clay-terracotta-300: #ffddca;
--sun-baked-clay-terracotta-400: #ffcbb1;
--sun-baked-clay-terracotta-500: #D96B43;
--sun-baked-clay-terracotta-600: #cb9072;
--sun-baked-clay-terracotta-700: #946349;
--sun-baked-clay-terracotta-800: #5e3925;
--sun-baked-clay-terracotta-900: #30180b;
--sun-baked-clay-terracotta-950: #0a0301;
}
$rich-mossy-sage: #708238; $rich-mossy-sage-50: #fbfdf6; $rich-mossy-sage-100: #f6f9ed; $rich-mossy-sage-200: #edf2dc; $rich-mossy-sage-300: #e0e7c6; $rich-mossy-sage-400: #cfd9aa; $rich-mossy-sage-500: #708238; $rich-mossy-sage-600: #94a068; $rich-mossy-sage-700: #677041; $rich-mossy-sage-800: #3e441f; $rich-mossy-sage-900: #1c2008; $rich-mossy-sage-950: #040501; $sun-baked-clay-terracotta: #D96B43; $sun-baked-clay-terracotta-50: #fffbf6; $sun-baked-clay-terracotta-100: #fff5ee; $sun-baked-clay-terracotta-200: #ffebdf; $sun-baked-clay-terracotta-300: #ffddca; $sun-baked-clay-terracotta-400: #ffcbb1; $sun-baked-clay-terracotta-500: #D96B43; $sun-baked-clay-terracotta-600: #cb9072; $sun-baked-clay-terracotta-700: #946349; $sun-baked-clay-terracotta-800: #5e3925; $sun-baked-clay-terracotta-900: #30180b; $sun-baked-clay-terracotta-950: #0a0301;
colors: {
'rich-mossy-sage': {
50: '#fbfdf6',
100: '#f6f9ed',
200: '#edf2dc',
300: '#e0e7c6',
400: '#cfd9aa',
500: '#708238',
600: '#94a068',
700: '#677041',
800: '#3e441f',
900: '#1c2008',
950: '#040501',
DEFAULT: '#708238',
},
'sun-baked-clay-terracotta': {
50: '#fffbf6',
100: '#fff5ee',
200: '#ffebdf',
300: '#ffddca',
400: '#ffcbb1',
500: '#D96B43',
600: '#cb9072',
700: '#946349',
800: '#5e3925',
900: '#30180b',
950: '#0a0301',
DEFAULT: '#D96B43',
},
},
[
{
"name": "rich-mossy-sage",
"harmony": "Palette",
"hex": "#708238",
"rgb": {
"r": 112,
"g": 130,
"b": 56
},
"hsl": {
"h": 75,
"s": 40,
"l": 36
},
"value": "#708238",
"tonalScale": {
"50": {
"hex": "#fbfdf6",
"rgb": {
"r": 251,
"g": 253,
"b": 246
}
},
"100": {
"hex": "#f6f9ed",
"rgb": {
"r": 246,
"g": 249,
"b": 237
}
},
"200": {
"hex": "#edf2dc",
"rgb": {
"r": 237,
"g": 242,
"b": 220
}
},
"300": {
"hex": "#e0e7c6",
"rgb": {
"r": 224,
"g": 231,
"b": 198
}
},
"400": {
"hex": "#cfd9aa",
"rgb": {
"r": 207,
"g": 217,
"b": 170
}
},
"500": {
"hex": "#708238",
"rgb": {
"r": 112,
"g": 130,
"b": 56
}
},
"600": {
"hex": "#94a068",
"rgb": {
"r": 148,
"g": 160,
"b": 104
}
},
"700": {
"hex": "#677041",
"rgb": {
"r": 103,
"g": 112,
"b": 65
}
},
"800": {
"hex": "#3e441f",
"rgb": {
"r": 62,
"g": 68,
"b": 31
}
},
"900": {
"hex": "#1c2008",
"rgb": {
"r": 28,
"g": 32,
"b": 8
}
},
"950": {
"hex": "#040501",
"rgb": {
"r": 4,
"g": 5,
"b": 1
}
}
}
},
{
"name": "sun-baked-clay-terracotta",
"harmony": "Palette",
"hex": "#D96B43",
"rgb": {
"r": 217,
"g": 107,
"b": 67
},
"hsl": {
"h": 16,
"s": 66,
"l": 56
},
"value": "#D96B43",
"tonalScale": {
"50": {
"hex": "#fffbf6",
"rgb": {
"r": 255,
"g": 251,
"b": 246
}
},
"100": {
"hex": "#fff5ee",
"rgb": {
"r": 255,
"g": 245,
"b": 238
}
},
"200": {
"hex": "#ffebdf",
"rgb": {
"r": 255,
"g": 235,
"b": 223
}
},
"300": {
"hex": "#ffddca",
"rgb": {
"r": 255,
"g": 221,
"b": 202
}
},
"400": {
"hex": "#ffcbb1",
"rgb": {
"r": 255,
"g": 203,
"b": 177
}
},
"500": {
"hex": "#D96B43",
"rgb": {
"r": 217,
"g": 107,
"b": 67
}
},
"600": {
"hex": "#cb9072",
"rgb": {
"r": 203,
"g": 144,
"b": 114
}
},
"700": {
"hex": "#946349",
"rgb": {
"r": 148,
"g": 99,
"b": 73
}
},
"800": {
"hex": "#5e3925",
"rgb": {
"r": 94,
"g": 57,
"b": 37
}
},
"900": {
"hex": "#30180b",
"rgb": {
"r": 48,
"g": 24,
"b": 11
}
},
"950": {
"hex": "#0a0301",
"rgb": {
"r": 10,
"g": 3,
"b": 1
}
}
}
}
]
Name,Harmony,Hex,RGB,HSL,Value,T50,T100,T200,T300,T400,T500,T600,T700,T800,T900,T950 rich-mossy-sage,Palette,#708238,"rgb(112, 130, 56)","hsl(75, 40%, 36%)",#708238,#fbfdf6,#f6f9ed,#edf2dc,#e0e7c6,#cfd9aa,#708238,#94a068,#677041,#3e441f,#1c2008,#040501 sun-baked-clay-terracotta,Palette,#D96B43,"rgb(217, 107, 67)","hsl(16, 66%, 56%)",#D96B43,#fffbf6,#fff5ee,#ffebdf,#ffddca,#ffcbb1,#D96B43,#cb9072,#946349,#5e3925,#30180b,#0a0301
GIMP Palette Name: PocketSwiss analogous Columns: 4 # 112 130 56 rich-mossy-sage 251 253 246 rich-mossy-sage-50 246 249 237 rich-mossy-sage-100 237 242 220 rich-mossy-sage-200 224 231 198 rich-mossy-sage-300 207 217 170 rich-mossy-sage-400 112 130 56 rich-mossy-sage-500 148 160 104 rich-mossy-sage-600 103 112 65 rich-mossy-sage-700 62 68 31 rich-mossy-sage-800 28 32 8 rich-mossy-sage-900 4 5 1 rich-mossy-sage-950 217 107 67 sun-baked-clay-terracotta 255 251 246 sun-baked-clay-terracotta-50 255 245 238 sun-baked-clay-terracotta-100 255 235 223 sun-baked-clay-terracotta-200 255 221 202 sun-baked-clay-terracotta-300 255 203 177 sun-baked-clay-terracotta-400 217 107 67 sun-baked-clay-terracotta-500 203 144 114 sun-baked-clay-terracotta-600 148 99 73 sun-baked-clay-terracotta-700 94 57 37 sun-baked-clay-terracotta-800 48 24 11 sun-baked-clay-terracotta-900 10 3 1 sun-baked-clay-terracotta-950
Binary ASE — use Download to save the file.
Binary ACO — use Download to save the file.