Start generating

Whirlpool to Enchanted Lilac color palette

A5DBC9Whirlpool6B4823Cafe RoyaleFFEDDCDelicate Seashell3F2651Stormy Night078F89Dark CyanAD96C9Enchanted Lilac
Open in generator Export PNG, PDF, ASE…

About this palette

Whirlpool to Enchanted Lilac is a 6-color cool palette: #A5DBC9 (Whirlpool), #6B4823 (Cafe Royale), #FFEDDC (Delicate Seashell), #3F2651 (Stormy Night), #078F89 (Dark Cyan), #AD96C9 (Enchanted Lilac). It mixes turquoise, brown, white, purple tones and feels cool overall. The strongest text pairing is #FFEDDC on #3F2651 with a contrast ratio of 11.45:1, and 5 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Whirlpoolrgb(165, 219, 201)hsl(160, 43%, 75%)
Cafe Royalergb(107, 72, 35)hsl(31, 51%, 28%)
Delicate Seashellrgb(255, 237, 220)hsl(29, 100%, 93%)
Stormy Nightrgb(63, 38, 81)hsl(275, 36%, 23%)
Dark Cyanrgb(7, 143, 137)hsl(177, 91%, 29%)
Enchanted Lilacrgb(173, 150, 201)hsl(267, 32%, 69%)

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.45:1 Very good#FFEDDC on #3F2651
  • Aa11.45:1 Very good#3F2651 on #FFEDDC
  • Aa8.45:1 Very good#A5DBC9 on #3F2651
  • Aa8.45:1 Very good#3F2651 on #A5DBC9
  • Aa7.14:1 Very good#6B4823 on #FFEDDC
  • Aa7.14:1 Very good#FFEDDC on #6B4823
  • Aa5.27:1 Good#A5DBC9 on #6B4823
  • Aa5.27:1 Good#6B4823 on #A5DBC9

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Whirlpool to Enchanted Lilac — https://swatchly.xyz/palette/a5dbc9-6b4823-ffeddc-3f2651-078f89-ad96c9 */
:root {
  --whirlpool: #a5dbc9;
  --cafe-royale: #6b4823;
  --delicate-seashell: #ffeddc;
  --stormy-night: #3f2651;
  --dark-cyan: #078f89;
  --enchanted-lilac: #ad96c9;
}

Tailwind CSS v4

/* Whirlpool to Enchanted Lilac — https://swatchly.xyz/palette/a5dbc9-6b4823-ffeddc-3f2651-078f89-ad96c9 */
@theme {
  --color-whirlpool: #a5dbc9;
  --color-whirlpool-50: #d7f7eb;
  --color-whirlpool-100: #c8ece0;
  --color-whirlpool-200: #a5dbc9;
  --color-whirlpool-300: #96c5b5;
  --color-whirlpool-400: #75a897;
  --color-whirlpool-500: #5a8e7d;
  --color-whirlpool-600: #427465;
  --color-whirlpool-700: #305e50;
  --color-whirlpool-800: #224b3f;
  --color-whirlpool-900: #173a30;
  --color-whirlpool-950: #0b251d;
  --color-cafe-royale: #6b4823;
  --color-cafe-royale-50: #fff3e7;
  --color-cafe-royale-100: #ffe6cf;
  --color-cafe-royale-200: #efd0b3;
  --color-cafe-royale-300: #dbb896;
  --color-cafe-royale-400: #bd9772;
  --color-cafe-royale-500: #a07a55;
  --color-cafe-royale-600: #835f3c;
  --color-cafe-royale-700: #6b4823;
  --color-cafe-royale-800: #53381b;
  --color-cafe-royale-900: #412a12;
  --color-cafe-royale-950: #2a1908;
  --color-delicate-seashell: #ffeddc;
  --color-delicate-seashell-50: #ffeddc;
  --color-delicate-seashell-100: #f1e5da;
  --color-delicate-seashell-200: #dfd2c5;
  --color-delicate-seashell-300: #cbbcae;
  --color-delicate-seashell-400: #ad9d8e;
  --color-delicate-seashell-500: #928273;
  --color-delicate-seashell-600: #78695a;
  --color-delicate-seashell-700: #605245;
  --color-delicate-seashell-800: #4c4034;
  --color-delicate-seashell-900: #3b3127;
  --color-delicate-seashell-950: #251e17;
  --color-stormy-night: #3f2651;
  --color-stormy-night-50: #f9f2ff;
  --color-stormy-night-100: #f3e5ff;
  --color-stormy-night-200: #e3cef5;
  --color-stormy-night-300: #ceb5e2;
  --color-stormy-night-400: #b095c6;
  --color-stormy-night-500: #9479aa;
  --color-stormy-night-600: #795f8e;
  --color-stormy-night-700: #624a74;
  --color-stormy-night-800: #4d385d;
  --color-stormy-night-900: #3f2651;
  --color-stormy-night-950: #261930;
  --color-dark-cyan: #078f89;
  --color-dark-cyan-50: #cdfffb;
  --color-dark-cyan-100: #b6f6f1;
  --color-dark-cyan-200: #95e3dd;
  --color-dark-cyan-300: #71ccc6;
  --color-dark-cyan-400: #40aca6;
  --color-dark-cyan-500: #078f89;
  --color-dark-cyan-600: #00736e;
  --color-dark-cyan-700: #005c58;
  --color-dark-cyan-800: #004845;
  --color-dark-cyan-900: #003836;
  --color-dark-cyan-950: #002422;
  --color-enchanted-lilac: #ad96c9;
  --color-enchanted-lilac-50: #f8f3ff;
  --color-enchanted-lilac-100: #f1e6ff;
  --color-enchanted-lilac-200: #e0cff7;
  --color-enchanted-lilac-300: #cbb7e4;
  --color-enchanted-lilac-400: #ad96c9;
  --color-enchanted-lilac-500: #917bac;
  --color-enchanted-lilac-600: #76618f;
  --color-enchanted-lilac-700: #5f4b75;
  --color-enchanted-lilac-800: #4b395e;
  --color-enchanted-lilac-900: #3a2b4a;
  --color-enchanted-lilac-950: #241a30;
}

Similar palettes