Warm Undertones Color Palette

Skin organized by its warm undertones — peach and ivory through golden mediums, sallow olive, and amber-terracotta into deep warm browns. Grouped in undertone bands rather than one straight ramp, so you can match the gold or olive cast of a specific complexion instead of a generic mid-brown. Made for sun-warmed, candlelit, and golden-hour portraits.

Open in Paintrix

Get Paintrix free on the App Store.

Download

.swatches Procreate · Paintrix .ase Adobe · Affinity .gpl GIMP · Inkscape

Hex codes

Color theory

Base

Complement

Analogous −30°

Analogous +30°

Triadic

Use it for

warm portraitsgolden-hour skincharacter designillustration

Code formats

CSS

:root {
  --warm-skin-undertones-1: #FBE7D6;
  --warm-skin-undertones-2: #F8DCC6;
  --warm-skin-undertones-3: #F4D1B6;
  --warm-skin-undertones-4: #EFC6A6;
  --warm-skin-undertones-5: #EABA96;
  --warm-skin-undertones-6: #E4AE86;
  --warm-skin-undertones-7: #E0B57A;
  --warm-skin-undertones-8: #D7A968;
  --warm-skin-undertones-9: #CD9D57;
  --warm-skin-undertones-10: #C39148;
  --warm-skin-undertones-11: #B9853B;
  --warm-skin-undertones-12: #AF7A31;
  --warm-skin-undertones-13: #9C7B3F;
  --warm-skin-undertones-14: #8E6F36;
  --warm-skin-undertones-15: #80642E;
  --warm-skin-undertones-16: #9A8348;
  --warm-skin-undertones-17: #88743C;
  --warm-skin-undertones-18: #766632;
  --warm-skin-undertones-19: #C77A45;
  --warm-skin-undertones-20: #B96B3A;
  --warm-skin-undertones-21: #AB5E30;
  --warm-skin-undertones-22: #9D5228;
  --warm-skin-undertones-23: #8F4721;
  --warm-skin-undertones-24: #823D1B;
  --warm-skin-undertones-25: #74351A;
  --warm-skin-undertones-26: #682F17;
  --warm-skin-undertones-27: #5C2914;
  --warm-skin-undertones-28: #502310;
  --warm-skin-undertones-29: #451E0D;
  --warm-skin-undertones-30: #3A190B;
}

SCSS

$warm-skin-undertones-1: #FBE7D6;
$warm-skin-undertones-2: #F8DCC6;
$warm-skin-undertones-3: #F4D1B6;
$warm-skin-undertones-4: #EFC6A6;
$warm-skin-undertones-5: #EABA96;
$warm-skin-undertones-6: #E4AE86;
$warm-skin-undertones-7: #E0B57A;
$warm-skin-undertones-8: #D7A968;
$warm-skin-undertones-9: #CD9D57;
$warm-skin-undertones-10: #C39148;
$warm-skin-undertones-11: #B9853B;
$warm-skin-undertones-12: #AF7A31;
$warm-skin-undertones-13: #9C7B3F;
$warm-skin-undertones-14: #8E6F36;
$warm-skin-undertones-15: #80642E;
$warm-skin-undertones-16: #9A8348;
$warm-skin-undertones-17: #88743C;
$warm-skin-undertones-18: #766632;
$warm-skin-undertones-19: #C77A45;
$warm-skin-undertones-20: #B96B3A;
$warm-skin-undertones-21: #AB5E30;
$warm-skin-undertones-22: #9D5228;
$warm-skin-undertones-23: #8F4721;
$warm-skin-undertones-24: #823D1B;
$warm-skin-undertones-25: #74351A;
$warm-skin-undertones-26: #682F17;
$warm-skin-undertones-27: #5C2914;
$warm-skin-undertones-28: #502310;
$warm-skin-undertones-29: #451E0D;
$warm-skin-undertones-30: #3A190B;

Tailwind

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'warm-skin-undertones': {
          '1': '#FBE7D6',
          '2': '#F8DCC6',
          '3': '#F4D1B6',
          '4': '#EFC6A6',
          '5': '#EABA96',
          '6': '#E4AE86',
          '7': '#E0B57A',
          '8': '#D7A968',
          '9': '#CD9D57',
          '10': '#C39148',
          '11': '#B9853B',
          '12': '#AF7A31',
          '13': '#9C7B3F',
          '14': '#8E6F36',
          '15': '#80642E',
          '16': '#9A8348',
          '17': '#88743C',
          '18': '#766632',
          '19': '#C77A45',
          '20': '#B96B3A',
          '21': '#AB5E30',
          '22': '#9D5228',
          '23': '#8F4721',
          '24': '#823D1B',
          '25': '#74351A',
          '26': '#682F17',
          '27': '#5C2914',
          '28': '#502310',
          '29': '#451E0D',
          '30': '#3A190B',
        },
      },
    },
  },
};

JSON

{
  "name": "Warm Undertones",
  "colors": [
    "#FBE7D6",
    "#F8DCC6",
    "#F4D1B6",
    "#EFC6A6",
    "#EABA96",
    "#E4AE86",
    "#E0B57A",
    "#D7A968",
    "#CD9D57",
    "#C39148",
    "#B9853B",
    "#AF7A31",
    "#9C7B3F",
    "#8E6F36",
    "#80642E",
    "#9A8348",
    "#88743C",
    "#766632",
    "#C77A45",
    "#B96B3A",
    "#AB5E30",
    "#9D5228",
    "#8F4721",
    "#823D1B",
    "#74351A",
    "#682F17",
    "#5C2914",
    "#502310",
    "#451E0D",
    "#3A190B"
  ]
}

Hex list

#FBE7D6
#F8DCC6
#F4D1B6
#EFC6A6
#EABA96
#E4AE86
#E0B57A
#D7A968
#CD9D57
#C39148
#B9853B
#AF7A31
#9C7B3F
#8E6F36
#80642E
#9A8348
#88743C
#766632
#C77A45
#B96B3A
#AB5E30
#9D5228
#8F4721
#823D1B
#74351A
#682F17
#5C2914
#502310
#451E0D
#3A190B

Warm Undertones Color Palette

Download

Hex codes

Color theory

Use it for

Code formats

Related palettes