← Back to Tools
Design premium architecture and B2B branding with this concrete and copper palette featuring #B87333 copper, #D4956A bronze light, #8E8E8E concrete, #3A3A3A charcoal, and #F0EDEA pale stone.
Export
Copy or download this palette as CSS, SCSS, Tailwind config, JSON, CSV, GPL, ASE or ACO.
:root {
--copper: #B87333;
--copper-50: #fffbf5;
--copper-100: #fff7ec;
--copper-200: #fdedda;
--copper-300: #f9e1c2;
--copper-400: #f1d0a5;
--copper-500: #B87333;
--copper-600: #bc9662;
--copper-700: #88683b;
--copper-800: #563d1a;
--copper-900: #2b1b04;
--copper-950: #080400;
--concrete: #8E8E8E;
--concrete-50: #fdfdfd;
--concrete-100: #f9f9f9;
--concrete-200: #f2f2f2;
--concrete-300: #e9e9e9;
--concrete-400: #dcdcdc;
--concrete-500: #8E8E8E;
--concrete-600: #a6a6a6;
--concrete-700: #747474;
--concrete-800: #464646;
--concrete-900: #212121;
--concrete-950: #050505;
--charcoal: #3A3A3A;
--charcoal-50: #fafafa;
--charcoal-100: #f2f2f2;
--charcoal-200: #e2e2e2;
--charcoal-300: #cecece;
--charcoal-400: #b3b3b3;
--charcoal-500: #3A3A3A;
--charcoal-600: #6e6e6e;
--charcoal-700: #4c4c4c;
--charcoal-800: #2c2c2c;
--charcoal-900: #121212;
--charcoal-950: #020202;
--pale-stone: #F0EDEA;
--pale-stone-50: #fffffe;
--pale-stone-100: #fefefe;
--pale-stone-200: #fefdfd;
--pale-stone-300: #fdfcfb;
--pale-stone-400: #fbfaf9;
--pale-stone-500: #F0EDEA;
--pale-stone-600: #d2d0cf;
--pale-stone-700: #949392;
--pale-stone-800: #5b5a59;
--pale-stone-900: #2c2c2b;
--pale-stone-950: #090808;
--bronze-light: #D4956A;
--bronze-light-50: #fffcf9;
--bronze-light-100: #fff9f3;
--bronze-light-200: #fff2e8;
--bronze-light-300: #fde9d9;
--bronze-light-400: #f8ddc7;
--bronze-light-500: #D4956A;
--bronze-light-600: #c8a98f;
--bronze-light-700: #90765f;
--bronze-light-800: #5a4636;
--bronze-light-900: #2d2016;
--bronze-light-950: #090502;
}
$copper: #B87333; $copper-50: #fffbf5; $copper-100: #fff7ec; $copper-200: #fdedda; $copper-300: #f9e1c2; $copper-400: #f1d0a5; $copper-500: #B87333; $copper-600: #bc9662; $copper-700: #88683b; $copper-800: #563d1a; $copper-900: #2b1b04; $copper-950: #080400; $concrete: #8E8E8E; $concrete-50: #fdfdfd; $concrete-100: #f9f9f9; $concrete-200: #f2f2f2; $concrete-300: #e9e9e9; $concrete-400: #dcdcdc; $concrete-500: #8E8E8E; $concrete-600: #a6a6a6; $concrete-700: #747474; $concrete-800: #464646; $concrete-900: #212121; $concrete-950: #050505; $charcoal: #3A3A3A; $charcoal-50: #fafafa; $charcoal-100: #f2f2f2; $charcoal-200: #e2e2e2; $charcoal-300: #cecece; $charcoal-400: #b3b3b3; $charcoal-500: #3A3A3A; $charcoal-600: #6e6e6e; $charcoal-700: #4c4c4c; $charcoal-800: #2c2c2c; $charcoal-900: #121212; $charcoal-950: #020202; $pale-stone: #F0EDEA; $pale-stone-50: #fffffe; $pale-stone-100: #fefefe; $pale-stone-200: #fefdfd; $pale-stone-300: #fdfcfb; $pale-stone-400: #fbfaf9; $pale-stone-500: #F0EDEA; $pale-stone-600: #d2d0cf; $pale-stone-700: #949392; $pale-stone-800: #5b5a59; $pale-stone-900: #2c2c2b; $pale-stone-950: #090808; $bronze-light: #D4956A; $bronze-light-50: #fffcf9; $bronze-light-100: #fff9f3; $bronze-light-200: #fff2e8; $bronze-light-300: #fde9d9; $bronze-light-400: #f8ddc7; $bronze-light-500: #D4956A; $bronze-light-600: #c8a98f; $bronze-light-700: #90765f; $bronze-light-800: #5a4636; $bronze-light-900: #2d2016; $bronze-light-950: #090502;
colors: {
'copper': {
50: '#fffbf5',
100: '#fff7ec',
200: '#fdedda',
300: '#f9e1c2',
400: '#f1d0a5',
500: '#B87333',
600: '#bc9662',
700: '#88683b',
800: '#563d1a',
900: '#2b1b04',
950: '#080400',
DEFAULT: '#B87333',
},
'concrete': {
50: '#fdfdfd',
100: '#f9f9f9',
200: '#f2f2f2',
300: '#e9e9e9',
400: '#dcdcdc',
500: '#8E8E8E',
600: '#a6a6a6',
700: '#747474',
800: '#464646',
900: '#212121',
950: '#050505',
DEFAULT: '#8E8E8E',
},
'charcoal': {
50: '#fafafa',
100: '#f2f2f2',
200: '#e2e2e2',
300: '#cecece',
400: '#b3b3b3',
500: '#3A3A3A',
600: '#6e6e6e',
700: '#4c4c4c',
800: '#2c2c2c',
900: '#121212',
950: '#020202',
DEFAULT: '#3A3A3A',
},
'pale-stone': {
50: '#fffffe',
100: '#fefefe',
200: '#fefdfd',
300: '#fdfcfb',
400: '#fbfaf9',
500: '#F0EDEA',
600: '#d2d0cf',
700: '#949392',
800: '#5b5a59',
900: '#2c2c2b',
950: '#090808',
DEFAULT: '#F0EDEA',
},
'bronze-light': {
50: '#fffcf9',
100: '#fff9f3',
200: '#fff2e8',
300: '#fde9d9',
400: '#f8ddc7',
500: '#D4956A',
600: '#c8a98f',
700: '#90765f',
800: '#5a4636',
900: '#2d2016',
950: '#090502',
DEFAULT: '#D4956A',
},
},
[
{
"name": "copper",
"harmony": "Palette",
"hex": "#B87333",
"rgb": {
"r": 184,
"g": 115,
"b": 51
},
"hsl": {
"h": 29,
"s": 57,
"l": 46
},
"value": "#B87333",
"tonalScale": {
"50": {
"hex": "#fffbf5",
"rgb": {
"r": 255,
"g": 251,
"b": 245
}
},
"100": {
"hex": "#fff7ec",
"rgb": {
"r": 255,
"g": 247,
"b": 236
}
},
"200": {
"hex": "#fdedda",
"rgb": {
"r": 253,
"g": 237,
"b": 218
}
},
"300": {
"hex": "#f9e1c2",
"rgb": {
"r": 249,
"g": 225,
"b": 194
}
},
"400": {
"hex": "#f1d0a5",
"rgb": {
"r": 241,
"g": 208,
"b": 165
}
},
"500": {
"hex": "#B87333",
"rgb": {
"r": 184,
"g": 115,
"b": 51
}
},
"600": {
"hex": "#bc9662",
"rgb": {
"r": 188,
"g": 150,
"b": 98
}
},
"700": {
"hex": "#88683b",
"rgb": {
"r": 136,
"g": 104,
"b": 59
}
},
"800": {
"hex": "#563d1a",
"rgb": {
"r": 86,
"g": 61,
"b": 26
}
},
"900": {
"hex": "#2b1b04",
"rgb": {
"r": 43,
"g": 27,
"b": 4
}
},
"950": {
"hex": "#080400",
"rgb": {
"r": 8,
"g": 4,
"b": 0
}
}
}
},
{
"name": "concrete",
"harmony": "Palette",
"hex": "#8E8E8E",
"rgb": {
"r": 142,
"g": 142,
"b": 142
},
"hsl": {
"h": 0,
"s": 0,
"l": 56
},
"value": "#8E8E8E",
"tonalScale": {
"50": {
"hex": "#fdfdfd",
"rgb": {
"r": 253,
"g": 253,
"b": 253
}
},
"100": {
"hex": "#f9f9f9",
"rgb": {
"r": 249,
"g": 249,
"b": 249
}
},
"200": {
"hex": "#f2f2f2",
"rgb": {
"r": 242,
"g": 242,
"b": 242
}
},
"300": {
"hex": "#e9e9e9",
"rgb": {
"r": 233,
"g": 233,
"b": 233
}
},
"400": {
"hex": "#dcdcdc",
"rgb": {
"r": 220,
"g": 220,
"b": 220
}
},
"500": {
"hex": "#8E8E8E",
"rgb": {
"r": 142,
"g": 142,
"b": 142
}
},
"600": {
"hex": "#a6a6a6",
"rgb": {
"r": 166,
"g": 166,
"b": 166
}
},
"700": {
"hex": "#747474",
"rgb": {
"r": 116,
"g": 116,
"b": 116
}
},
"800": {
"hex": "#464646",
"rgb": {
"r": 70,
"g": 70,
"b": 70
}
},
"900": {
"hex": "#212121",
"rgb": {
"r": 33,
"g": 33,
"b": 33
}
},
"950": {
"hex": "#050505",
"rgb": {
"r": 5,
"g": 5,
"b": 5
}
}
}
},
{
"name": "charcoal",
"harmony": "Palette",
"hex": "#3A3A3A",
"rgb": {
"r": 58,
"g": 58,
"b": 58
},
"hsl": {
"h": 0,
"s": 0,
"l": 23
},
"value": "#3A3A3A",
"tonalScale": {
"50": {
"hex": "#fafafa",
"rgb": {
"r": 250,
"g": 250,
"b": 250
}
},
"100": {
"hex": "#f2f2f2",
"rgb": {
"r": 242,
"g": 242,
"b": 242
}
},
"200": {
"hex": "#e2e2e2",
"rgb": {
"r": 226,
"g": 226,
"b": 226
}
},
"300": {
"hex": "#cecece",
"rgb": {
"r": 206,
"g": 206,
"b": 206
}
},
"400": {
"hex": "#b3b3b3",
"rgb": {
"r": 179,
"g": 179,
"b": 179
}
},
"500": {
"hex": "#3A3A3A",
"rgb": {
"r": 58,
"g": 58,
"b": 58
}
},
"600": {
"hex": "#6e6e6e",
"rgb": {
"r": 110,
"g": 110,
"b": 110
}
},
"700": {
"hex": "#4c4c4c",
"rgb": {
"r": 76,
"g": 76,
"b": 76
}
},
"800": {
"hex": "#2c2c2c",
"rgb": {
"r": 44,
"g": 44,
"b": 44
}
},
"900": {
"hex": "#121212",
"rgb": {
"r": 18,
"g": 18,
"b": 18
}
},
"950": {
"hex": "#020202",
"rgb": {
"r": 2,
"g": 2,
"b": 2
}
}
}
},
{
"name": "pale-stone",
"harmony": "Palette",
"hex": "#F0EDEA",
"rgb": {
"r": 240,
"g": 237,
"b": 234
},
"hsl": {
"h": 30,
"s": 17,
"l": 93
},
"value": "#F0EDEA",
"tonalScale": {
"50": {
"hex": "#fffffe",
"rgb": {
"r": 255,
"g": 255,
"b": 254
}
},
"100": {
"hex": "#fefefe",
"rgb": {
"r": 254,
"g": 254,
"b": 254
}
},
"200": {
"hex": "#fefdfd",
"rgb": {
"r": 254,
"g": 253,
"b": 253
}
},
"300": {
"hex": "#fdfcfb",
"rgb": {
"r": 253,
"g": 252,
"b": 251
}
},
"400": {
"hex": "#fbfaf9",
"rgb": {
"r": 251,
"g": 250,
"b": 249
}
},
"500": {
"hex": "#F0EDEA",
"rgb": {
"r": 240,
"g": 237,
"b": 234
}
},
"600": {
"hex": "#d2d0cf",
"rgb": {
"r": 210,
"g": 208,
"b": 207
}
},
"700": {
"hex": "#949392",
"rgb": {
"r": 148,
"g": 147,
"b": 146
}
},
"800": {
"hex": "#5b5a59",
"rgb": {
"r": 91,
"g": 90,
"b": 89
}
},
"900": {
"hex": "#2c2c2b",
"rgb": {
"r": 44,
"g": 44,
"b": 43
}
},
"950": {
"hex": "#090808",
"rgb": {
"r": 9,
"g": 8,
"b": 8
}
}
}
},
{
"name": "bronze-light",
"harmony": "Palette",
"hex": "#D4956A",
"rgb": {
"r": 212,
"g": 149,
"b": 106
},
"hsl": {
"h": 24,
"s": 55,
"l": 62
},
"value": "#D4956A",
"tonalScale": {
"50": {
"hex": "#fffcf9",
"rgb": {
"r": 255,
"g": 252,
"b": 249
}
},
"100": {
"hex": "#fff9f3",
"rgb": {
"r": 255,
"g": 249,
"b": 243
}
},
"200": {
"hex": "#fff2e8",
"rgb": {
"r": 255,
"g": 242,
"b": 232
}
},
"300": {
"hex": "#fde9d9",
"rgb": {
"r": 253,
"g": 233,
"b": 217
}
},
"400": {
"hex": "#f8ddc7",
"rgb": {
"r": 248,
"g": 221,
"b": 199
}
},
"500": {
"hex": "#D4956A",
"rgb": {
"r": 212,
"g": 149,
"b": 106
}
},
"600": {
"hex": "#c8a98f",
"rgb": {
"r": 200,
"g": 169,
"b": 143
}
},
"700": {
"hex": "#90765f",
"rgb": {
"r": 144,
"g": 118,
"b": 95
}
},
"800": {
"hex": "#5a4636",
"rgb": {
"r": 90,
"g": 70,
"b": 54
}
},
"900": {
"hex": "#2d2016",
"rgb": {
"r": 45,
"g": 32,
"b": 22
}
},
"950": {
"hex": "#090502",
"rgb": {
"r": 9,
"g": 5,
"b": 2
}
}
}
}
]
Name,Harmony,Hex,RGB,HSL,Value,T50,T100,T200,T300,T400,T500,T600,T700,T800,T900,T950 copper,Palette,#B87333,"rgb(184, 115, 51)","hsl(29, 57%, 46%)",#B87333,#fffbf5,#fff7ec,#fdedda,#f9e1c2,#f1d0a5,#B87333,#bc9662,#88683b,#563d1a,#2b1b04,#080400 concrete,Palette,#8E8E8E,"rgb(142, 142, 142)","hsl(0, 0%, 56%)",#8E8E8E,#fdfdfd,#f9f9f9,#f2f2f2,#e9e9e9,#dcdcdc,#8E8E8E,#a6a6a6,#747474,#464646,#212121,#050505 charcoal,Palette,#3A3A3A,"rgb(58, 58, 58)","hsl(0, 0%, 23%)",#3A3A3A,#fafafa,#f2f2f2,#e2e2e2,#cecece,#b3b3b3,#3A3A3A,#6e6e6e,#4c4c4c,#2c2c2c,#121212,#020202 pale-stone,Palette,#F0EDEA,"rgb(240, 237, 234)","hsl(30, 17%, 93%)",#F0EDEA,#fffffe,#fefefe,#fefdfd,#fdfcfb,#fbfaf9,#F0EDEA,#d2d0cf,#949392,#5b5a59,#2c2c2b,#090808 bronze-light,Palette,#D4956A,"rgb(212, 149, 106)","hsl(24, 55%, 62%)",#D4956A,#fffcf9,#fff9f3,#fff2e8,#fde9d9,#f8ddc7,#D4956A,#c8a98f,#90765f,#5a4636,#2d2016,#090502
GIMP Palette Name: PocketSwiss analogous Columns: 4 # 184 115 51 copper 255 251 245 copper-50 255 247 236 copper-100 253 237 218 copper-200 249 225 194 copper-300 241 208 165 copper-400 184 115 51 copper-500 188 150 98 copper-600 136 104 59 copper-700 86 61 26 copper-800 43 27 4 copper-900 8 4 0 copper-950 142 142 142 concrete 253 253 253 concrete-50 249 249 249 concrete-100 242 242 242 concrete-200 233 233 233 concrete-300 220 220 220 concrete-400 142 142 142 concrete-500 166 166 166 concrete-600 116 116 116 concrete-700 70 70 70 concrete-800 33 33 33 concrete-900 5 5 5 concrete-950 58 58 58 charcoal 250 250 250 charcoal-50 242 242 242 charcoal-100 226 226 226 charcoal-200 206 206 206 charcoal-300 179 179 179 charcoal-400 58 58 58 charcoal-500 110 110 110 charcoal-600 76 76 76 charcoal-700 44 44 44 charcoal-800 18 18 18 charcoal-900 2 2 2 charcoal-950 240 237 234 pale-stone 255 255 254 pale-stone-50 254 254 254 pale-stone-100 254 253 253 pale-stone-200 253 252 251 pale-stone-300 251 250 249 pale-stone-400 240 237 234 pale-stone-500 210 208 207 pale-stone-600 148 147 146 pale-stone-700 91 90 89 pale-stone-800 44 44 43 pale-stone-900 9 8 8 pale-stone-950 212 149 106 bronze-light 255 252 249 bronze-light-50 255 249 243 bronze-light-100 255 242 232 bronze-light-200 253 233 217 bronze-light-300 248 221 199 bronze-light-400 212 149 106 bronze-light-500 200 169 143 bronze-light-600 144 118 95 bronze-light-700 90 70 54 bronze-light-800 45 32 22 bronze-light-900 9 5 2 bronze-light-950
Binary ASE — use Download to save the file.
Binary ACO — use Download to save the file.