Heavy Cream to Voodoo color palette

E6DCC5Heavy Cream 9CB38CFoliage 6F86A8English Manor 8E662BAged Antics 4C6343Muddy Olive 483047Voodoo

Open in generator Export PNG, PDF, ASE…

About this palette

Heavy Cream to Voodoo is a 6-color muted, cool palette: #E6DCC5 (Heavy Cream), #9CB38C (Foliage), #6F86A8 (English Manor), #8E662B (Aged Antics), #4C6343 (Muddy Olive), #483047 (Voodoo). It mixes gray, green, blue, brown, purple tones and feels cool overall. The strongest text pairing is #E6DCC5 on #483047 with a contrast ratio of 8.61:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Heavy Cream	rgb(230, 220, 197)	hsl(42, 40%, 84%)
Foliage	rgb(156, 179, 140)	hsl(95, 20%, 63%)
English Manor	rgb(111, 134, 168)	hsl(216, 25%, 55%)
Aged Antics	rgb(142, 102, 43)	hsl(36, 54%, 36%)
Muddy Olive	rgb(76, 99, 67)	hsl(103, 19%, 33%)
Voodoo	rgb(72, 48, 71)	hsl(302, 20%, 24%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

Aa8.61:1 Very good#E6DCC5 on #483047
Aa8.61:1 Very good#483047 on #E6DCC5
Aa5.16:1 Good#9CB38C on #483047
Aa5.16:1 Good#483047 on #9CB38C
Aa4.86:1 Good#E6DCC5 on #4C6343
Aa4.86:1 Good#4C6343 on #E6DCC5
Aa3.77:1 Poor#E6DCC5 on #8E662B
Aa3.77:1 Poor#8E662B on #E6DCC5

Color blindness preview

CSS variables

/* Heavy Cream to Voodoo — https://swatchly.xyz/palette/e6dcc5-9cb38c-6f86a8-8e662b-4c6343-483047 */
:root {
  --heavy-cream: #e6dcc5;
  --foliage: #9cb38c;
  --english-manor: #6f86a8;
  --aged-antics: #8e662b;
  --muddy-olive: #4c6343;
  --voodoo: #483047;
}

Tailwind CSS v4

/* Heavy Cream to Voodoo — https://swatchly.xyz/palette/e6dcc5-9cb38c-6f86a8-8e662b-4c6343-483047 */
@theme {
  --color-heavy-cream: #e6dcc5;
  --color-heavy-cream-50: #fef8ec;
  --color-heavy-cream-100: #f5efe2;
  --color-heavy-cream-200: #e6dcc5;
  --color-heavy-cream-300: #cdc5b2;
  --color-heavy-cream-400: #ada48f;
  --color-heavy-cream-500: #918873;
  --color-heavy-cream-600: #756d58;
  --color-heavy-cream-700: #5d5543;
  --color-heavy-cream-800: #494232;
  --color-heavy-cream-900: #383225;
  --color-heavy-cream-950: #231f15;
  --color-foliage: #9cb38c;
  --color-foliage-50: #f0fde8;
  --color-foliage-100: #e7f5dd;
  --color-foliage-200: #d3e4c8;
  --color-foliage-300: #bcd0af;
  --color-foliage-400: #9cb38c;
  --color-foliage-500: #7f9670;
  --color-foliage-600: #647955;
  --color-foliage-700: #4d603f;
  --color-foliage-800: #3a4b2e;
  --color-foliage-900: #2b3921;
  --color-foliage-950: #192311;
  --color-english-manor: #6f86a8;
  --color-english-manor-50: #eff5ff;
  --color-english-manor-100: #dfecff;
  --color-english-manor-200: #c5d8f4;
  --color-english-manor-300: #acc1e1;
  --color-english-manor-400: #8ba2c4;
  --color-english-manor-500: #6f86a8;
  --color-english-manor-600: #566c8c;
  --color-english-manor-700: #425572;
  --color-english-manor-800: #31425c;
  --color-english-manor-900: #253348;
  --color-english-manor-950: #151f2f;
  --color-aged-antics: #8e662b;
  --color-aged-antics-50: #fff3e4;
  --color-aged-antics-100: #ffe8ca;
  --color-aged-antics-200: #f4d3a8;
  --color-aged-antics-300: #e1bc8b;
  --color-aged-antics-400: #c49c64;
  --color-aged-antics-500: #a98046;
  --color-aged-antics-600: #8e662b;
  --color-aged-antics-700: #735017;
  --color-aged-antics-800: #5c3d07;
  --color-aged-antics-900: #482e01;
  --color-aged-antics-950: #2e1c00;
  --color-muddy-olive: #4c6343;
  --color-muddy-olive-50: #ecfbe6;
  --color-muddy-olive-100: #e0f1da;
  --color-muddy-olive-200: #cce0c5;
  --color-muddy-olive-300: #b5cbad;
  --color-muddy-olive-400: #95ad8c;
  --color-muddy-olive-500: #7a9371;
  --color-muddy-olive-600: #617958;
  --color-muddy-olive-700: #4c6343;
  --color-muddy-olive-800: #3a4e33;
  --color-muddy-olive-900: #2c3c25;
  --color-muddy-olive-950: #1a2615;
  --color-voodoo: #483047;
  --color-voodoo-50: #fff0fe;
  --color-voodoo-100: #f7e4f6;
  --color-voodoo-200: #e6cfe4;
  --color-voodoo-300: #d1b8cf;
  --color-voodoo-400: #b499b2;
  --color-voodoo-500: #9a7e99;
  --color-voodoo-600: #80657f;
  --color-voodoo-700: #695168;
  --color-voodoo-800: #564054;
  --color-voodoo-900: #483047;
  --color-voodoo-950: #2d1f2c;
}