Enchanted Lavender to Cloud Break color palette

C0A4E7Enchanted Lavender 281833Dark Prom Queen 9E43CBDreamscape Purple 6B2598Queens of the Dead F8EFFFCloud Break

Open in generator Export PNG, PDF, ASE…

About this palette

Enchanted Lavender to Cloud Break is a 5-color cool, monochromatic palette: #C0A4E7 (Enchanted Lavender), #281833 (Dark Prom Queen), #9E43CB (Dreamscape Purple), #6B2598 (Queens of the Dead), #F8EFFF (Cloud Break). It mixes purple, white tones and feels cool overall. The strongest text pairing is #281833 on #F8EFFF with a contrast ratio of 14.80:1, and 4 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Enchanted Lavender	rgb(192, 164, 231)	hsl(265, 58%, 77%)
Dark Prom Queen	rgb(40, 24, 51)	hsl(276, 36%, 15%)
Dreamscape Purple	rgb(158, 67, 203)	hsl(280, 57%, 53%)
Queens of the Dead	rgb(107, 37, 152)	hsl(277, 61%, 37%)
Cloud Break	rgb(248, 239, 255)	hsl(274, 100%, 97%)

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.

Aa14.80:1 Super#281833 on #F8EFFF
Aa14.80:1 Super#F8EFFF on #281833
Aa8.02:1 Very good#6B2598 on #F8EFFF
Aa8.02:1 Very good#F8EFFF on #6B2598
Aa7.65:1 Very good#C0A4E7 on #281833
Aa7.65:1 Very good#281833 on #C0A4E7
Aa4.56:1 Good#9E43CB on #F8EFFF
Aa4.56:1 Good#F8EFFF on #9E43CB

Color blindness preview

CSS variables

/* Enchanted Lavender to Cloud Break — https://swatchly.xyz/palette/c0a4e7-281833-9e43cb-6b2598-f8efff */
:root {
  --enchanted-lavender: #c0a4e7;
  --dark-prom-queen: #281833;
  --dreamscape-purple: #9e43cb;
  --queens-of-the-dead: #6b2598;
  --cloud-break: #f8efff;
}

Tailwind CSS v4

/* Enchanted Lavender to Cloud Break — https://swatchly.xyz/palette/c0a4e7-281833-9e43cb-6b2598-f8efff */
@theme {
  --color-enchanted-lavender: #c0a4e7;
  --color-enchanted-lavender-50: #f2eaff;
  --color-enchanted-lavender-100: #e9daff;
  --color-enchanted-lavender-200: #d6c0f7;
  --color-enchanted-lavender-300: #c0a4e7;
  --color-enchanted-lavender-400: #a388c7;
  --color-enchanted-lavender-500: #8a6fae;
  --color-enchanted-lavender-600: #715792;
  --color-enchanted-lavender-700: #5c447a;
  --color-enchanted-lavender-800: #4a3464;
  --color-enchanted-lavender-900: #3b2851;
  --color-enchanted-lavender-950: #251835;
  --color-dark-prom-queen: #281833;
  --color-dark-prom-queen-50: #f9f2ff;
  --color-dark-prom-queen-100: #f2e5fc;
  --color-dark-prom-queen-200: #e0d1ec;
  --color-dark-prom-queen-300: #cab9d8;
  --color-dark-prom-queen-400: #ac99ba;
  --color-dark-prom-queen-500: #907e9f;
  --color-dark-prom-queen-600: #766483;
  --color-dark-prom-queen-700: #5e4e6b;
  --color-dark-prom-queen-800: #4b3c55;
  --color-dark-prom-queen-900: #3a2e43;
  --color-dark-prom-queen-950: #281833;
  --color-dreamscape-purple: #9e43cb;
  --color-dreamscape-purple-50: #faf2ff;
  --color-dreamscape-purple-100: #f5e7ff;
  --color-dreamscape-purple-200: #ecceff;
  --color-dreamscape-purple-300: #e1afff;
  --color-dreamscape-purple-400: #d27eff;
  --color-dreamscape-purple-500: #b85fe7;
  --color-dreamscape-purple-600: #9e43cb;
  --color-dreamscape-purple-700: #822aab;
  --color-dreamscape-purple-800: #68168c;
  --color-dreamscape-purple-900: #520770;
  --color-dreamscape-purple-950: #35014b;
  --color-queens-of-the-dead: #6b2598;
  --color-queens-of-the-dead-50: #f9f2ff;
  --color-queens-of-the-dead-100: #f2e5ff;
  --color-queens-of-the-dead-200: #e5c9ff;
  --color-queens-of-the-dead-300: #d6a7ff;
  --color-queens-of-the-dead-400: #bc7def;
  --color-queens-of-the-dead-500: #a05ed2;
  --color-queens-of-the-dead-600: #8342b1;
  --color-queens-of-the-dead-700: #6b2598;
  --color-queens-of-the-dead-800: #531e76;
  --color-queens-of-the-dead-900: #41135f;
  --color-queens-of-the-dead-950: #2a093f;
  --color-cloud-break: #f8efff;
  --color-cloud-break-50: #f8efff;
  --color-cloud-break-100: #ece7f1;
  --color-cloud-break-200: #dad3df;
  --color-cloud-break-300: #c4bdca;
  --color-cloud-break-400: #a59dab;
  --color-cloud-break-500: #8a8290;
  --color-cloud-break-600: #706876;
  --color-cloud-break-700: #59525e;
  --color-cloud-break-800: #46404a;
  --color-cloud-break-900: #363039;
  --color-cloud-break-950: #211e24;
}