Blossom to Ethereal Espresso color palette

FFE8D4Blossom E2A383Les Demoiselles d’Avignon 97712BPuma 5A5812Ayahuasca Vine 40241AEthereal Espresso

Open in generator Export PNG, PDF, ASE…

About this palette

Blossom to Ethereal Espresso is a 5-color warm, earthy, vintage, gradient palette: #FFE8D4 (Blossom), #E2A383 (Les Demoiselles d’Avignon), #97712B (Puma), #5A5812 (Ayahuasca Vine), #40241A (Ethereal Espresso). It mixes white, orange, yellow, brown tones and feels warm overall. The strongest text pairing is #FFE8D4 on #40241A with a contrast ratio of 11.95:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Blossom	rgb(255, 232, 212)	hsl(28, 100%, 92%)
Les Demoiselles d’Avignon	rgb(226, 163, 131)	hsl(20, 62%, 70%)
Puma	rgb(151, 113, 43)	hsl(39, 56%, 38%)
Ayahuasca Vine	rgb(90, 88, 18)	hsl(58, 67%, 21%)
Ethereal Espresso	rgb(64, 36, 26)	hsl(16, 42%, 18%)

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.

Aa11.95:1 Very good#FFE8D4 on #40241A
Aa11.95:1 Very good#40241A on #FFE8D4
Aa6.60:1 Good#E2A383 on #40241A
Aa6.60:1 Good#40241A on #E2A383
Aa6.25:1 Good#FFE8D4 on #5A5812
Aa6.25:1 Good#5A5812 on #FFE8D4
Aa3.77:1 Poor#FFE8D4 on #97712B
Aa3.77:1 Poor#97712B on #FFE8D4

Color blindness preview

CSS variables

/* Blossom to Ethereal Espresso — https://swatchly.xyz/palette/ffe8d4-e2a383-97712b-5a5812-40241a */
:root {
  --blossom: #ffe8d4;
  --les-demoiselles-d-avignon: #e2a383;
  --puma: #97712b;
  --ayahuasca-vine: #5a5812;
  --ethereal-espresso: #40241a;
}

Tailwind CSS v4

/* Blossom to Ethereal Espresso — https://swatchly.xyz/palette/ffe8d4-e2a383-97712b-5a5812-40241a */
@theme {
  --color-blossom: #ffe8d4;
  --color-blossom-50: #fff4eb;
  --color-blossom-100: #ffe8d4;
  --color-blossom-200: #e6d5c7;
  --color-blossom-300: #d1beae;
  --color-blossom-400: #b29e8c;
  --color-blossom-500: #978270;
  --color-blossom-600: #7b6857;
  --color-blossom-700: #635142;
  --color-blossom-800: #4e3f31;
  --color-blossom-900: #3d3024;
  --color-blossom-950: #261d15;
  --color-les-demoiselles-d-avignon: #e2a383;
  --color-les-demoiselles-d-avignon-50: #ffe9de;
  --color-les-demoiselles-d-avignon-100: #ffd9c6;
  --color-les-demoiselles-d-avignon-200: #f3bfa5;
  --color-les-demoiselles-d-avignon-300: #e2a383;
  --color-les-demoiselles-d-avignon-400: #c28768;
  --color-les-demoiselles-d-avignon-500: #a86d4f;
  --color-les-demoiselles-d-avignon-600: #8d5639;
  --color-les-demoiselles-d-avignon-700: #744328;
  --color-les-demoiselles-d-avignon-800: #5f331c;
  --color-les-demoiselles-d-avignon-900: #4d2713;
  --color-les-demoiselles-d-avignon-950: #321708;
  --color-puma: #97712b;
  --color-puma-50: #fff4e1;
  --color-puma-100: #ffebca;
  --color-puma-200: #f5d8a8;
  --color-puma-300: #e4c28b;
  --color-puma-400: #c9a465;
  --color-puma-500: #b18a47;
  --color-puma-600: #97712b;
  --color-puma-700: #7b5810;
  --color-puma-800: #624400;
  --color-puma-900: #4c3300;
  --color-puma-950: #301f00;
  --color-ayahuasca-vine: #5a5812;
  --color-ayahuasca-vine-50: #f8f8d3;
  --color-ayahuasca-vine-100: #eeefc5;
  --color-ayahuasca-vine-200: #dbdbaa;
  --color-ayahuasca-vine-300: #c5c58c;
  --color-ayahuasca-vine-400: #a6a566;
  --color-ayahuasca-vine-500: #8b8a48;
  --color-ayahuasca-vine-600: #706f2e;
  --color-ayahuasca-vine-700: #5a5812;
  --color-ayahuasca-vine-800: #46450d;
  --color-ayahuasca-vine-900: #363504;
  --color-ayahuasca-vine-950: #222101;
  --color-ethereal-espresso: #40241a;
  --color-ethereal-espresso-50: #fff2ed;
  --color-ethereal-espresso-100: #fde5dd;
  --color-ethereal-espresso-200: #edd1c7;
  --color-ethereal-espresso-300: #d9b9ae;
  --color-ethereal-espresso-400: #ba978b;
  --color-ethereal-espresso-500: #9d7b6f;
  --color-ethereal-espresso-600: #7f6054;
  --color-ethereal-espresso-700: #65493f;
  --color-ethereal-espresso-800: #4e362e;
  --color-ethereal-espresso-900: #40241a;
  --color-ethereal-espresso-950: #241612;
}