Pale Sky to Chocolate Covered color palette

C3EFFFPale Sky 522209Evil Cigar EB9D7DLes Demoiselles d’Avignon 3493B5Enchanted Well 8F411EChocolate Covered

Open in generator Export PNG, PDF, ASE…

About this palette

Pale Sky to Chocolate Covered is a 5-color warm, earthy, vintage palette: #C3EFFF (Pale Sky), #522209 (Evil Cigar), #EB9D7D (Les Demoiselles d’Avignon), #3493B5 (Enchanted Well), #8F411E (Chocolate Covered). It mixes blue, brown, orange tones and feels warm overall. The strongest text pairing is #C3EFFF on #522209 with a contrast ratio of 10.75:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pale Sky	rgb(195, 239, 255)	hsl(196, 100%, 88%)
Evil Cigar	rgb(82, 34, 9)	hsl(21, 80%, 18%)
Les Demoiselles d’Avignon	rgb(235, 157, 125)	hsl(17, 73%, 71%)
Enchanted Well	rgb(52, 147, 181)	hsl(196, 55%, 46%)
Chocolate Covered	rgb(143, 65, 30)	hsl(19, 65%, 34%)

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.

Aa10.75:1 Very good#C3EFFF on #522209
Aa10.75:1 Very good#522209 on #C3EFFF
Aa6.06:1 Good#522209 on #EB9D7D
Aa6.06:1 Good#EB9D7D on #522209
Aa5.81:1 Good#C3EFFF on #8F411E
Aa5.81:1 Good#8F411E on #C3EFFF
Aa3.76:1 Poor#522209 on #3493B5
Aa3.76:1 Poor#3493B5 on #522209

Color blindness preview

CSS variables

/* Pale Sky to Chocolate Covered — https://swatchly.xyz/palette/c3efff-522209-eb9d7d-3493b5-8f411e */
:root {
  --pale-sky: #c3efff;
  --evil-cigar: #522209;
  --les-demoiselles-d-avignon: #eb9d7d;
  --enchanted-well: #3493b5;
  --chocolate-covered: #8f411e;
}

Tailwind CSS v4

/* Pale Sky to Chocolate Covered — https://swatchly.xyz/palette/c3efff-522209-eb9d7d-3493b5-8f411e */
@theme {
  --color-pale-sky: #c3efff;
  --color-pale-sky-50: #def6ff;
  --color-pale-sky-100: #c3efff;
  --color-pale-sky-200: #b9dae6;
  --color-pale-sky-300: #a0c5d2;
  --color-pale-sky-400: #7ea7b5;
  --color-pale-sky-500: #638c9b;
  --color-pale-sky-600: #4a7280;
  --color-pale-sky-700: #375b68;
  --color-pale-sky-800: #274853;
  --color-pale-sky-900: #1c3740;
  --color-pale-sky-950: #0e2229;
  --color-evil-cigar: #522209;
  --color-evil-cigar-50: #fff2ed;
  --color-evil-cigar-100: #ffe5da;
  --color-evil-cigar-200: #faccb8;
  --color-evil-cigar-300: #e7b49d;
  --color-evil-cigar-400: #ca927a;
  --color-evil-cigar-500: #af765d;
  --color-evil-cigar-600: #915c44;
  --color-evil-cigar-700: #774731;
  --color-evil-cigar-800: #5f3522;
  --color-evil-cigar-900: #522209;
  --color-evil-cigar-950: #30170b;
  --color-les-demoiselles-d-avignon: #eb9d7d;
  --color-les-demoiselles-d-avignon-50: #ffe8df;
  --color-les-demoiselles-d-avignon-100: #ffd8c8;
  --color-les-demoiselles-d-avignon-200: #fbbaa0;
  --color-les-demoiselles-d-avignon-300: #eb9d7d;
  --color-les-demoiselles-d-avignon-400: #cb8162;
  --color-les-demoiselles-d-avignon-500: #b16849;
  --color-les-demoiselles-d-avignon-600: #955033;
  --color-les-demoiselles-d-avignon-700: #7b3d23;
  --color-les-demoiselles-d-avignon-800: #652f17;
  --color-les-demoiselles-d-avignon-900: #52230e;
  --color-les-demoiselles-d-avignon-950: #361405;
  --color-enchanted-well: #3493b5;
  --color-enchanted-well-50: #e9f8ff;
  --color-enchanted-well-100: #d2f1ff;
  --color-enchanted-well-200: #a3e3fe;
  --color-enchanted-well-300: #83cdec;
  --color-enchanted-well-400: #58afd0;
  --color-enchanted-well-500: #3493b5;
  --color-enchanted-well-600: #0c7798;
  --color-enchanted-well-700: #005f7a;
  --color-enchanted-well-800: #004a60;
  --color-enchanted-well-900: #00394b;
  --color-enchanted-well-950: #002430;
  --color-chocolate-covered: #8f411e;
  --color-chocolate-covered-50: #fff2ed;
  --color-chocolate-covered-100: #ffe5db;
  --color-chocolate-covered-200: #ffcbb7;
  --color-chocolate-covered-300: #faaf90;
  --color-chocolate-covered-400: #df8d6c;
  --color-chocolate-covered-500: #c4714f;
  --color-chocolate-covered-600: #a75836;
  --color-chocolate-covered-700: #8f411e;
  --color-chocolate-covered-800: #723114;
  --color-chocolate-covered-900: #5a2309;
  --color-chocolate-covered-950: #3c1403;
}