Passion Flower to Holographic Lavender color palette

6D5A93Passion Flower 413459Maharaja A291BCWizard’s Brew 191321Back in Black C7AAEAEnchanted Lavender F0E7FFHolographic Lavender

Open in generator Export PNG, PDF, ASE…

About this palette

Passion Flower to Holographic Lavender is a 6-color cool palette: #6D5A93 (Passion Flower), #413459 (Maharaja), #A291BC (Wizard’s Brew), #191321 (Back in Black), #C7AAEA (Enchanted Lavender), #F0E7FF (Holographic Lavender). It mixes purple, black, white tones and feels cool overall. The strongest text pairing is #191321 on #F0E7FF with a contrast ratio of 15.20:1, and 6 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Passion Flower	rgb(109, 90, 147)	hsl(260, 24%, 46%)
Maharaja	rgb(65, 52, 89)	hsl(261, 26%, 28%)
Wizard’s Brew	rgb(162, 145, 188)	hsl(264, 24%, 65%)
Back in Black	rgb(25, 19, 33)	hsl(266, 27%, 10%)
Enchanted Lavender	rgb(199, 170, 234)	hsl(267, 60%, 79%)
Holographic Lavender	rgb(240, 231, 255)	hsl(262, 100%, 95%)

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.

Aa15.20:1 Super#191321 on #F0E7FF
Aa15.20:1 Super#F0E7FF on #191321
Aa9.45:1 Very good#413459 on #F0E7FF
Aa9.45:1 Very good#F0E7FF on #413459
Aa8.96:1 Very good#191321 on #C7AAEA
Aa8.96:1 Very good#C7AAEA on #191321
Aa6.32:1 Good#A291BC on #191321
Aa6.32:1 Good#191321 on #A291BC

Color blindness preview

CSS variables

/* Passion Flower to Holographic Lavender — https://swatchly.xyz/palette/6d5a93-413459-a291bc-191321-c7aaea-f0e7ff */
:root {
  --passion-flower: #6d5a93;
  --maharaja: #413459;
  --wizard-s-brew: #a291bc;
  --back-in-black: #191321;
  --enchanted-lavender: #c7aaea;
  --holographic-lavender: #f0e7ff;
}

Tailwind CSS v4

/* Passion Flower to Holographic Lavender — https://swatchly.xyz/palette/6d5a93-413459-a291bc-191321-c7aaea-f0e7ff */
@theme {
  --color-passion-flower: #6d5a93;
  --color-passion-flower-50: #f6f3ff;
  --color-passion-flower-100: #ede6ff;
  --color-passion-flower-200: #dbccfd;
  --color-passion-flower-300: #c4b3ea;
  --color-passion-flower-400: #a492cd;
  --color-passion-flower-500: #8875b0;
  --color-passion-flower-600: #6d5a93;
  --color-passion-flower-700: #574678;
  --color-passion-flower-800: #443561;
  --color-passion-flower-900: #35284d;
  --color-passion-flower-950: #211832;
  --color-maharaja: #413459;
  --color-maharaja-50: #f6f3ff;
  --color-maharaja-100: #eee7ff;
  --color-maharaja-200: #dbd1f3;
  --color-maharaja-300: #c4b8df;
  --color-maharaja-400: #a497c1;
  --color-maharaja-500: #887aa4;
  --color-maharaja-600: #6c5f87;
  --color-maharaja-700: #54496c;
  --color-maharaja-800: #413459;
  --color-maharaja-900: #312941;
  --color-maharaja-950: #1e1829;
  --color-wizard-s-brew: #a291bc;
  --color-wizard-s-brew-50: #f5efff;
  --color-wizard-s-brew-100: #ece1ff;
  --color-wizard-s-brew-200: #d9cbee;
  --color-wizard-s-brew-300: #c2b2da;
  --color-wizard-s-brew-400: #a291bc;
  --color-wizard-s-brew-500: #8877a1;
  --color-wizard-s-brew-600: #6e5f86;
  --color-wizard-s-brew-700: #584a6d;
  --color-wizard-s-brew-800: #463958;
  --color-wizard-s-brew-900: #372c46;
  --color-wizard-s-brew-950: #231b2e;
  --color-back-in-black: #191321;
  --color-back-in-black-50: #f7f3fe;
  --color-back-in-black-100: #ede8f5;
  --color-back-in-black-200: #dad4e3;
  --color-back-in-black-300: #c4bdce;
  --color-back-in-black-400: #a59eb0;
  --color-back-in-black-500: #888093;
  --color-back-in-black-600: #6b6476;
  --color-back-in-black-700: #534d5c;
  --color-back-in-black-800: #3e3946;
  --color-back-in-black-900: #2d2833;
  --color-back-in-black-950: #191321;
  --color-enchanted-lavender: #c7aaea;
  --color-enchanted-lavender-50: #f5edff;
  --color-enchanted-lavender-100: #eddfff;
  --color-enchanted-lavender-200: #dcc5f8;
  --color-enchanted-lavender-300: #c7aaea;
  --color-enchanted-lavender-400: #a88dc9;
  --color-enchanted-lavender-500: #8e72af;
  --color-enchanted-lavender-600: #755a93;
  --color-enchanted-lavender-700: #5e4679;
  --color-enchanted-lavender-800: #4b3562;
  --color-enchanted-lavender-900: #3b294f;
  --color-enchanted-lavender-950: #251834;
  --color-holographic-lavender: #f0e7ff;
  --color-holographic-lavender-50: #f8f3ff;
  --color-holographic-lavender-100: #f0e7ff;
  --color-holographic-lavender-200: #dbd4e6;
  --color-holographic-lavender-300: #c5bdd1;
  --color-holographic-lavender-400: #a69db3;
  --color-holographic-lavender-500: #8a8297;
  --color-holographic-lavender-600: #6f687c;
  --color-holographic-lavender-700: #585164;
  --color-holographic-lavender-800: #453f4f;
  --color-holographic-lavender-900: #35303d;
  --color-holographic-lavender-950: #211d27;
}