← Back to Tools
Shift modern colors to look like aged, faded physical ink prints, incorporating mustard yellow (#E5A93B), muted avocado green (#7A8B6F), and deep burnt brick red (#B85042).
Export
Copy or download this palette as CSS, SCSS, Tailwind config, JSON, CSV, GPL, ASE or ACO.
:root {
--mustard-yellow: #E5A93B;
--mustard-yellow-50: #fffdf4;
--mustard-yellow-100: #fffbeb;
--mustard-yellow-200: #fff6db;
--mustard-yellow-300: #ffefc4;
--mustard-yellow-400: #fde5a8;
--mustard-yellow-500: #E5A93B;
--mustard-yellow-600: #cfb368;
--mustard-yellow-700: #957d3c;
--mustard-yellow-800: #5e4b16;
--mustard-yellow-900: #2f2301;
--mustard-yellow-950: #0a0600;
--muted-avocado-green: #7A8B6F;
--muted-avocado-green-50: #fcfdfb;
--muted-avocado-green-100: #f7f9f5;
--muted-avocado-green-200: #eef2eb;
--muted-avocado-green-300: #e2e9de;
--muted-avocado-green-400: #d3dbcd;
--muted-avocado-green-500: #7A8B6F;
--muted-avocado-green-600: #9aa493;
--muted-avocado-green-700: #6b7465;
--muted-avocado-green-800: #40463b;
--muted-avocado-green-900: #1d211a;
--muted-avocado-green-950: #040503;
--deep-burnt-brick-red: #B85042;
--deep-burnt-brick-red-50: #fff9f7;
--deep-burnt-brick-red-100: #fff3f0;
--deep-burnt-brick-red-200: #ffe6e0;
--deep-burnt-brick-red-300: #fdd4cc;
--deep-burnt-brick-red-400: #f5bdb2;
--deep-burnt-brick-red-500: #B85042;
--deep-burnt-brick-red-600: #bd7e72;
--deep-burnt-brick-red-700: #8a554b;
--deep-burnt-brick-red-800: #583029;
--deep-burnt-brick-red-900: #2c130f;
--deep-burnt-brick-red-950: #090201;
}
$mustard-yellow: #E5A93B; $mustard-yellow-50: #fffdf4; $mustard-yellow-100: #fffbeb; $mustard-yellow-200: #fff6db; $mustard-yellow-300: #ffefc4; $mustard-yellow-400: #fde5a8; $mustard-yellow-500: #E5A93B; $mustard-yellow-600: #cfb368; $mustard-yellow-700: #957d3c; $mustard-yellow-800: #5e4b16; $mustard-yellow-900: #2f2301; $mustard-yellow-950: #0a0600; $muted-avocado-green: #7A8B6F; $muted-avocado-green-50: #fcfdfb; $muted-avocado-green-100: #f7f9f5; $muted-avocado-green-200: #eef2eb; $muted-avocado-green-300: #e2e9de; $muted-avocado-green-400: #d3dbcd; $muted-avocado-green-500: #7A8B6F; $muted-avocado-green-600: #9aa493; $muted-avocado-green-700: #6b7465; $muted-avocado-green-800: #40463b; $muted-avocado-green-900: #1d211a; $muted-avocado-green-950: #040503; $deep-burnt-brick-red: #B85042; $deep-burnt-brick-red-50: #fff9f7; $deep-burnt-brick-red-100: #fff3f0; $deep-burnt-brick-red-200: #ffe6e0; $deep-burnt-brick-red-300: #fdd4cc; $deep-burnt-brick-red-400: #f5bdb2; $deep-burnt-brick-red-500: #B85042; $deep-burnt-brick-red-600: #bd7e72; $deep-burnt-brick-red-700: #8a554b; $deep-burnt-brick-red-800: #583029; $deep-burnt-brick-red-900: #2c130f; $deep-burnt-brick-red-950: #090201;
colors: {
'mustard-yellow': {
50: '#fffdf4',
100: '#fffbeb',
200: '#fff6db',
300: '#ffefc4',
400: '#fde5a8',
500: '#E5A93B',
600: '#cfb368',
700: '#957d3c',
800: '#5e4b16',
900: '#2f2301',
950: '#0a0600',
DEFAULT: '#E5A93B',
},
'muted-avocado-green': {
50: '#fcfdfb',
100: '#f7f9f5',
200: '#eef2eb',
300: '#e2e9de',
400: '#d3dbcd',
500: '#7A8B6F',
600: '#9aa493',
700: '#6b7465',
800: '#40463b',
900: '#1d211a',
950: '#040503',
DEFAULT: '#7A8B6F',
},
'deep-burnt-brick-red': {
50: '#fff9f7',
100: '#fff3f0',
200: '#ffe6e0',
300: '#fdd4cc',
400: '#f5bdb2',
500: '#B85042',
600: '#bd7e72',
700: '#8a554b',
800: '#583029',
900: '#2c130f',
950: '#090201',
DEFAULT: '#B85042',
},
},
[
{
"name": "mustard-yellow",
"harmony": "Palette",
"hex": "#E5A93B",
"rgb": {
"r": 229,
"g": 169,
"b": 59
},
"hsl": {
"h": 39,
"s": 77,
"l": 56
},
"value": "#E5A93B",
"tonalScale": {
"50": {
"hex": "#fffdf4",
"rgb": {
"r": 255,
"g": 253,
"b": 244
}
},
"100": {
"hex": "#fffbeb",
"rgb": {
"r": 255,
"g": 251,
"b": 235
}
},
"200": {
"hex": "#fff6db",
"rgb": {
"r": 255,
"g": 246,
"b": 219
}
},
"300": {
"hex": "#ffefc4",
"rgb": {
"r": 255,
"g": 239,
"b": 196
}
},
"400": {
"hex": "#fde5a8",
"rgb": {
"r": 253,
"g": 229,
"b": 168
}
},
"500": {
"hex": "#E5A93B",
"rgb": {
"r": 229,
"g": 169,
"b": 59
}
},
"600": {
"hex": "#cfb368",
"rgb": {
"r": 207,
"g": 179,
"b": 104
}
},
"700": {
"hex": "#957d3c",
"rgb": {
"r": 149,
"g": 125,
"b": 60
}
},
"800": {
"hex": "#5e4b16",
"rgb": {
"r": 94,
"g": 75,
"b": 22
}
},
"900": {
"hex": "#2f2301",
"rgb": {
"r": 47,
"g": 35,
"b": 1
}
},
"950": {
"hex": "#0a0600",
"rgb": {
"r": 10,
"g": 6,
"b": 0
}
}
}
},
{
"name": "muted-avocado-green",
"harmony": "Palette",
"hex": "#7A8B6F",
"rgb": {
"r": 122,
"g": 139,
"b": 111
},
"hsl": {
"h": 96,
"s": 11,
"l": 49
},
"value": "#7A8B6F",
"tonalScale": {
"50": {
"hex": "#fcfdfb",
"rgb": {
"r": 252,
"g": 253,
"b": 251
}
},
"100": {
"hex": "#f7f9f5",
"rgb": {
"r": 247,
"g": 249,
"b": 245
}
},
"200": {
"hex": "#eef2eb",
"rgb": {
"r": 238,
"g": 242,
"b": 235
}
},
"300": {
"hex": "#e2e9de",
"rgb": {
"r": 226,
"g": 233,
"b": 222
}
},
"400": {
"hex": "#d3dbcd",
"rgb": {
"r": 211,
"g": 219,
"b": 205
}
},
"500": {
"hex": "#7A8B6F",
"rgb": {
"r": 122,
"g": 139,
"b": 111
}
},
"600": {
"hex": "#9aa493",
"rgb": {
"r": 154,
"g": 164,
"b": 147
}
},
"700": {
"hex": "#6b7465",
"rgb": {
"r": 107,
"g": 116,
"b": 101
}
},
"800": {
"hex": "#40463b",
"rgb": {
"r": 64,
"g": 70,
"b": 59
}
},
"900": {
"hex": "#1d211a",
"rgb": {
"r": 29,
"g": 33,
"b": 26
}
},
"950": {
"hex": "#040503",
"rgb": {
"r": 4,
"g": 5,
"b": 3
}
}
}
},
{
"name": "deep-burnt-brick-red",
"harmony": "Palette",
"hex": "#B85042",
"rgb": {
"r": 184,
"g": 80,
"b": 66
},
"hsl": {
"h": 7,
"s": 47,
"l": 49
},
"value": "#B85042",
"tonalScale": {
"50": {
"hex": "#fff9f7",
"rgb": {
"r": 255,
"g": 249,
"b": 247
}
},
"100": {
"hex": "#fff3f0",
"rgb": {
"r": 255,
"g": 243,
"b": 240
}
},
"200": {
"hex": "#ffe6e0",
"rgb": {
"r": 255,
"g": 230,
"b": 224
}
},
"300": {
"hex": "#fdd4cc",
"rgb": {
"r": 253,
"g": 212,
"b": 204
}
},
"400": {
"hex": "#f5bdb2",
"rgb": {
"r": 245,
"g": 189,
"b": 178
}
},
"500": {
"hex": "#B85042",
"rgb": {
"r": 184,
"g": 80,
"b": 66
}
},
"600": {
"hex": "#bd7e72",
"rgb": {
"r": 189,
"g": 126,
"b": 114
}
},
"700": {
"hex": "#8a554b",
"rgb": {
"r": 138,
"g": 85,
"b": 75
}
},
"800": {
"hex": "#583029",
"rgb": {
"r": 88,
"g": 48,
"b": 41
}
},
"900": {
"hex": "#2c130f",
"rgb": {
"r": 44,
"g": 19,
"b": 15
}
},
"950": {
"hex": "#090201",
"rgb": {
"r": 9,
"g": 2,
"b": 1
}
}
}
}
]
Name,Harmony,Hex,RGB,HSL,Value,T50,T100,T200,T300,T400,T500,T600,T700,T800,T900,T950 mustard-yellow,Palette,#E5A93B,"rgb(229, 169, 59)","hsl(39, 77%, 56%)",#E5A93B,#fffdf4,#fffbeb,#fff6db,#ffefc4,#fde5a8,#E5A93B,#cfb368,#957d3c,#5e4b16,#2f2301,#0a0600 muted-avocado-green,Palette,#7A8B6F,"rgb(122, 139, 111)","hsl(96, 11%, 49%)",#7A8B6F,#fcfdfb,#f7f9f5,#eef2eb,#e2e9de,#d3dbcd,#7A8B6F,#9aa493,#6b7465,#40463b,#1d211a,#040503 deep-burnt-brick-red,Palette,#B85042,"rgb(184, 80, 66)","hsl(7, 47%, 49%)",#B85042,#fff9f7,#fff3f0,#ffe6e0,#fdd4cc,#f5bdb2,#B85042,#bd7e72,#8a554b,#583029,#2c130f,#090201
GIMP Palette Name: PocketSwiss analogous Columns: 4 # 229 169 59 mustard-yellow 255 253 244 mustard-yellow-50 255 251 235 mustard-yellow-100 255 246 219 mustard-yellow-200 255 239 196 mustard-yellow-300 253 229 168 mustard-yellow-400 229 169 59 mustard-yellow-500 207 179 104 mustard-yellow-600 149 125 60 mustard-yellow-700 94 75 22 mustard-yellow-800 47 35 1 mustard-yellow-900 10 6 0 mustard-yellow-950 122 139 111 muted-avocado-green 252 253 251 muted-avocado-green-50 247 249 245 muted-avocado-green-100 238 242 235 muted-avocado-green-200 226 233 222 muted-avocado-green-300 211 219 205 muted-avocado-green-400 122 139 111 muted-avocado-green-500 154 164 147 muted-avocado-green-600 107 116 101 muted-avocado-green-700 64 70 59 muted-avocado-green-800 29 33 26 muted-avocado-green-900 4 5 3 muted-avocado-green-950 184 80 66 deep-burnt-brick-red 255 249 247 deep-burnt-brick-red-50 255 243 240 deep-burnt-brick-red-100 255 230 224 deep-burnt-brick-red-200 253 212 204 deep-burnt-brick-red-300 245 189 178 deep-burnt-brick-red-400 184 80 66 deep-burnt-brick-red-500 189 126 114 deep-burnt-brick-red-600 138 85 75 deep-burnt-brick-red-700 88 48 41 deep-burnt-brick-red-800 44 19 15 deep-burnt-brick-red-900 9 2 1 deep-burnt-brick-red-950
Binary ASE — use Download to save the file.
Binary ACO — use Download to save the file.