← Back to Tools
Force triadic calculations into authentic vintage mustard and burnt orange, featuring heavy velvet mustard (#D4A316), dark burnt orange (#CA5310), and deep retro teal (#116A7B).
Export
Copy or download this palette as CSS, SCSS, Tailwind config, JSON, CSV, GPL, ASE or ACO.
:root {
--velvet-mustard: #D4A316;
--velvet-mustard-50: #fffef0;
--velvet-mustard-100: #fffbe5;
--velvet-mustard-200: #fef6cf;
--velvet-mustard-300: #fcefb1;
--velvet-mustard-400: #f8e489;
--velvet-mustard-500: #D4A316;
--velvet-mustard-600: #c8b036;
--velvet-mustard-700: #907b00;
--velvet-mustard-800: #5b4a00;
--velvet-mustard-900: #2d2300;
--velvet-mustard-950: #090500;
--dark-burnt-orange: #CA5310;
--dark-burnt-orange-50: #fffaf1;
--dark-burnt-orange-100: #fff4e4;
--dark-burnt-orange-200: #ffe7cd;
--dark-burnt-orange-300: #ffd6ac;
--dark-burnt-orange-400: #fcc083;
--dark-burnt-orange-500: #CA5310;
--dark-burnt-orange-600: #c6802f;
--dark-burnt-orange-700: #915600;
--dark-burnt-orange-800: #5d3000;
--dark-burnt-orange-900: #301300;
--dark-burnt-orange-950: #0a0200;
--deep-retro-teal: #116A7B;
--deep-retro-teal-50: #f3fdff;
--deep-retro-teal-100: #e7f9fb;
--deep-retro-teal-200: #d1eff3;
--deep-retro-teal-300: #b2e3e9;
--deep-retro-teal-400: #89d1da;
--deep-retro-teal-500: #116A7B;
--deep-retro-teal-600: #32929d;
--deep-retro-teal-700: #056771;
--deep-retro-teal-800: #003f46;
--deep-retro-teal-900: #001d22;
--deep-retro-teal-950: #000406;
}
$velvet-mustard: #D4A316; $velvet-mustard-50: #fffef0; $velvet-mustard-100: #fffbe5; $velvet-mustard-200: #fef6cf; $velvet-mustard-300: #fcefb1; $velvet-mustard-400: #f8e489; $velvet-mustard-500: #D4A316; $velvet-mustard-600: #c8b036; $velvet-mustard-700: #907b00; $velvet-mustard-800: #5b4a00; $velvet-mustard-900: #2d2300; $velvet-mustard-950: #090500; $dark-burnt-orange: #CA5310; $dark-burnt-orange-50: #fffaf1; $dark-burnt-orange-100: #fff4e4; $dark-burnt-orange-200: #ffe7cd; $dark-burnt-orange-300: #ffd6ac; $dark-burnt-orange-400: #fcc083; $dark-burnt-orange-500: #CA5310; $dark-burnt-orange-600: #c6802f; $dark-burnt-orange-700: #915600; $dark-burnt-orange-800: #5d3000; $dark-burnt-orange-900: #301300; $dark-burnt-orange-950: #0a0200; $deep-retro-teal: #116A7B; $deep-retro-teal-50: #f3fdff; $deep-retro-teal-100: #e7f9fb; $deep-retro-teal-200: #d1eff3; $deep-retro-teal-300: #b2e3e9; $deep-retro-teal-400: #89d1da; $deep-retro-teal-500: #116A7B; $deep-retro-teal-600: #32929d; $deep-retro-teal-700: #056771; $deep-retro-teal-800: #003f46; $deep-retro-teal-900: #001d22; $deep-retro-teal-950: #000406;
colors: {
'velvet-mustard': {
50: '#fffef0',
100: '#fffbe5',
200: '#fef6cf',
300: '#fcefb1',
400: '#f8e489',
500: '#D4A316',
600: '#c8b036',
700: '#907b00',
800: '#5b4a00',
900: '#2d2300',
950: '#090500',
DEFAULT: '#D4A316',
},
'dark-burnt-orange': {
50: '#fffaf1',
100: '#fff4e4',
200: '#ffe7cd',
300: '#ffd6ac',
400: '#fcc083',
500: '#CA5310',
600: '#c6802f',
700: '#915600',
800: '#5d3000',
900: '#301300',
950: '#0a0200',
DEFAULT: '#CA5310',
},
'deep-retro-teal': {
50: '#f3fdff',
100: '#e7f9fb',
200: '#d1eff3',
300: '#b2e3e9',
400: '#89d1da',
500: '#116A7B',
600: '#32929d',
700: '#056771',
800: '#003f46',
900: '#001d22',
950: '#000406',
DEFAULT: '#116A7B',
},
},
[
{
"name": "velvet-mustard",
"harmony": "Palette",
"hex": "#D4A316",
"rgb": {
"r": 212,
"g": 163,
"b": 22
},
"hsl": {
"h": 45,
"s": 81,
"l": 46
},
"value": "#D4A316",
"tonalScale": {
"50": {
"hex": "#fffef0",
"rgb": {
"r": 255,
"g": 254,
"b": 240
}
},
"100": {
"hex": "#fffbe5",
"rgb": {
"r": 255,
"g": 251,
"b": 229
}
},
"200": {
"hex": "#fef6cf",
"rgb": {
"r": 254,
"g": 246,
"b": 207
}
},
"300": {
"hex": "#fcefb1",
"rgb": {
"r": 252,
"g": 239,
"b": 177
}
},
"400": {
"hex": "#f8e489",
"rgb": {
"r": 248,
"g": 228,
"b": 137
}
},
"500": {
"hex": "#D4A316",
"rgb": {
"r": 212,
"g": 163,
"b": 22
}
},
"600": {
"hex": "#c8b036",
"rgb": {
"r": 200,
"g": 176,
"b": 54
}
},
"700": {
"hex": "#907b00",
"rgb": {
"r": 144,
"g": 123,
"b": 0
}
},
"800": {
"hex": "#5b4a00",
"rgb": {
"r": 91,
"g": 74,
"b": 0
}
},
"900": {
"hex": "#2d2300",
"rgb": {
"r": 45,
"g": 35,
"b": 0
}
},
"950": {
"hex": "#090500",
"rgb": {
"r": 9,
"g": 5,
"b": 0
}
}
}
},
{
"name": "dark-burnt-orange",
"harmony": "Palette",
"hex": "#CA5310",
"rgb": {
"r": 202,
"g": 83,
"b": 16
},
"hsl": {
"h": 22,
"s": 85,
"l": 43
},
"value": "#CA5310",
"tonalScale": {
"50": {
"hex": "#fffaf1",
"rgb": {
"r": 255,
"g": 250,
"b": 241
}
},
"100": {
"hex": "#fff4e4",
"rgb": {
"r": 255,
"g": 244,
"b": 228
}
},
"200": {
"hex": "#ffe7cd",
"rgb": {
"r": 255,
"g": 231,
"b": 205
}
},
"300": {
"hex": "#ffd6ac",
"rgb": {
"r": 255,
"g": 214,
"b": 172
}
},
"400": {
"hex": "#fcc083",
"rgb": {
"r": 252,
"g": 192,
"b": 131
}
},
"500": {
"hex": "#CA5310",
"rgb": {
"r": 202,
"g": 83,
"b": 16
}
},
"600": {
"hex": "#c6802f",
"rgb": {
"r": 198,
"g": 128,
"b": 47
}
},
"700": {
"hex": "#915600",
"rgb": {
"r": 145,
"g": 86,
"b": 0
}
},
"800": {
"hex": "#5d3000",
"rgb": {
"r": 93,
"g": 48,
"b": 0
}
},
"900": {
"hex": "#301300",
"rgb": {
"r": 48,
"g": 19,
"b": 0
}
},
"950": {
"hex": "#0a0200",
"rgb": {
"r": 10,
"g": 2,
"b": 0
}
}
}
},
{
"name": "deep-retro-teal",
"harmony": "Palette",
"hex": "#116A7B",
"rgb": {
"r": 17,
"g": 106,
"b": 123
},
"hsl": {
"h": 190,
"s": 76,
"l": 27
},
"value": "#116A7B",
"tonalScale": {
"50": {
"hex": "#f3fdff",
"rgb": {
"r": 243,
"g": 253,
"b": 255
}
},
"100": {
"hex": "#e7f9fb",
"rgb": {
"r": 231,
"g": 249,
"b": 251
}
},
"200": {
"hex": "#d1eff3",
"rgb": {
"r": 209,
"g": 239,
"b": 243
}
},
"300": {
"hex": "#b2e3e9",
"rgb": {
"r": 178,
"g": 227,
"b": 233
}
},
"400": {
"hex": "#89d1da",
"rgb": {
"r": 137,
"g": 209,
"b": 218
}
},
"500": {
"hex": "#116A7B",
"rgb": {
"r": 17,
"g": 106,
"b": 123
}
},
"600": {
"hex": "#32929d",
"rgb": {
"r": 50,
"g": 146,
"b": 157
}
},
"700": {
"hex": "#056771",
"rgb": {
"r": 5,
"g": 103,
"b": 113
}
},
"800": {
"hex": "#003f46",
"rgb": {
"r": 0,
"g": 63,
"b": 70
}
},
"900": {
"hex": "#001d22",
"rgb": {
"r": 0,
"g": 29,
"b": 34
}
},
"950": {
"hex": "#000406",
"rgb": {
"r": 0,
"g": 4,
"b": 6
}
}
}
}
]
Name,Harmony,Hex,RGB,HSL,Value,T50,T100,T200,T300,T400,T500,T600,T700,T800,T900,T950 velvet-mustard,Palette,#D4A316,"rgb(212, 163, 22)","hsl(45, 81%, 46%)",#D4A316,#fffef0,#fffbe5,#fef6cf,#fcefb1,#f8e489,#D4A316,#c8b036,#907b00,#5b4a00,#2d2300,#090500 dark-burnt-orange,Palette,#CA5310,"rgb(202, 83, 16)","hsl(22, 85%, 43%)",#CA5310,#fffaf1,#fff4e4,#ffe7cd,#ffd6ac,#fcc083,#CA5310,#c6802f,#915600,#5d3000,#301300,#0a0200 deep-retro-teal,Palette,#116A7B,"rgb(17, 106, 123)","hsl(190, 76%, 27%)",#116A7B,#f3fdff,#e7f9fb,#d1eff3,#b2e3e9,#89d1da,#116A7B,#32929d,#056771,#003f46,#001d22,#000406
GIMP Palette Name: PocketSwiss analogous Columns: 4 # 212 163 22 velvet-mustard 255 254 240 velvet-mustard-50 255 251 229 velvet-mustard-100 254 246 207 velvet-mustard-200 252 239 177 velvet-mustard-300 248 228 137 velvet-mustard-400 212 163 22 velvet-mustard-500 200 176 54 velvet-mustard-600 144 123 0 velvet-mustard-700 91 74 0 velvet-mustard-800 45 35 0 velvet-mustard-900 9 5 0 velvet-mustard-950 202 83 16 dark-burnt-orange 255 250 241 dark-burnt-orange-50 255 244 228 dark-burnt-orange-100 255 231 205 dark-burnt-orange-200 255 214 172 dark-burnt-orange-300 252 192 131 dark-burnt-orange-400 202 83 16 dark-burnt-orange-500 198 128 47 dark-burnt-orange-600 145 86 0 dark-burnt-orange-700 93 48 0 dark-burnt-orange-800 48 19 0 dark-burnt-orange-900 10 2 0 dark-burnt-orange-950 17 106 123 deep-retro-teal 243 253 255 deep-retro-teal-50 231 249 251 deep-retro-teal-100 209 239 243 deep-retro-teal-200 178 227 233 deep-retro-teal-300 137 209 218 deep-retro-teal-400 17 106 123 deep-retro-teal-500 50 146 157 deep-retro-teal-600 5 103 113 deep-retro-teal-700 0 63 70 deep-retro-teal-800 0 29 34 deep-retro-teal-900 0 4 6 deep-retro-teal-950
Binary ASE — use Download to save the file.
Binary ACO — use Download to save the file.