Start generating

Haunted Candelabra to Strawberry Cheesecake color palette

543F65Haunted Candelabra5E5B98Wizard’s Potion8D93C7Easter EggC4B6D3Fog SyringaFFDDECStrawberry Cheesecake
Open in generator Export PNG, PDF, ASE…

About this palette

Haunted Candelabra to Strawberry Cheesecake is a 5-color cool, gradient palette: #543F65 (Haunted Candelabra), #5E5B98 (Wizard’s Potion), #8D93C7 (Easter Egg), #C4B6D3 (Fog Syringa), #FFDDEC (Strawberry Cheesecake). It mixes purple, pink tones and feels cool overall. The strongest text pairing is #543F65 on #FFDDEC with a contrast ratio of 7.38:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Haunted Candelabrargb(84, 63, 101)hsl(273, 23%, 32%)
Wizard’s Potionrgb(94, 91, 152)hsl(243, 25%, 48%)
Easter Eggrgb(141, 147, 199)hsl(234, 34%, 67%)
Fog Syringargb(196, 182, 211)hsl(269, 25%, 77%)
Strawberry Cheesecakergb(255, 221, 236)hsl(334, 100%, 93%)

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.

  • Aa7.38:1 Very good#543F65 on #FFDDEC
  • Aa7.38:1 Very good#FFDDEC on #543F65
  • Aa4.91:1 Good#5E5B98 on #FFDDEC
  • Aa4.91:1 Good#FFDDEC on #5E5B98
  • Aa4.82:1 Good#543F65 on #C4B6D3
  • Aa4.82:1 Good#C4B6D3 on #543F65
  • Aa3.20:1 Poor#5E5B98 on #C4B6D3
  • Aa3.20:1 Poor#C4B6D3 on #5E5B98

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Haunted Candelabra to Strawberry Cheesecake — https://swatchly.xyz/palette/543f65-5e5b98-8d93c7-c4b6d3-ffddec */
:root {
  --haunted-candelabra: #543f65;
  --wizard-s-potion: #5e5b98;
  --easter-egg: #8d93c7;
  --fog-syringa: #c4b6d3;
  --strawberry-cheesecake: #ffddec;
}

Tailwind CSS v4

/* Haunted Candelabra to Strawberry Cheesecake — https://swatchly.xyz/palette/543f65-5e5b98-8d93c7-c4b6d3-ffddec */
@theme {
  --color-haunted-candelabra: #543f65;
  --color-haunted-candelabra-50: #f9f2ff;
  --color-haunted-candelabra-100: #f3e5ff;
  --color-haunted-candelabra-200: #e1cff1;
  --color-haunted-candelabra-300: #cdb9df;
  --color-haunted-candelabra-400: #b09ac3;
  --color-haunted-candelabra-500: #967fa9;
  --color-haunted-candelabra-600: #7c668f;
  --color-haunted-candelabra-700: #665277;
  --color-haunted-candelabra-800: #543f65;
  --color-haunted-candelabra-900: #40314d;
  --color-haunted-candelabra-950: #291e33;
  --color-wizard-s-potion: #5e5b98;
  --color-wizard-s-potion-50: #f4f4ff;
  --color-wizard-s-potion-100: #e7e7ff;
  --color-wizard-s-potion-200: #cfcfff;
  --color-wizard-s-potion-300: #b6b5f1;
  --color-wizard-s-potion-400: #9594d4;
  --color-wizard-s-potion-500: #7977b6;
  --color-wizard-s-potion-600: #5e5b98;
  --color-wizard-s-potion-700: #4a477c;
  --color-wizard-s-potion-800: #393764;
  --color-wizard-s-potion-900: #2c2950;
  --color-wizard-s-potion-950: #1b1934;
  --color-easter-egg: #8d93c7;
  --color-easter-egg-50: #eef1ff;
  --color-easter-egg-100: #e0e4ff;
  --color-easter-egg-200: #c7cdf8;
  --color-easter-egg-300: #aeb4e4;
  --color-easter-egg-400: #8d93c7;
  --color-easter-egg-500: #7479ac;
  --color-easter-egg-600: #5c6190;
  --color-easter-egg-700: #494c77;
  --color-easter-egg-800: #383c61;
  --color-easter-egg-900: #2b2e4e;
  --color-easter-egg-950: #1b1d34;
  --color-fog-syringa: #c4b6d3;
  --color-fog-syringa-50: #f7efff;
  --color-fog-syringa-100: #ede4f7;
  --color-fog-syringa-200: #dacfe5;
  --color-fog-syringa-300: #c4b6d3;
  --color-fog-syringa-400: #a598b3;
  --color-fog-syringa-500: #8a7d98;
  --color-fog-syringa-600: #70647d;
  --color-fog-syringa-700: #5a4e66;
  --color-fog-syringa-800: #473d51;
  --color-fog-syringa-900: #372f40;
  --color-fog-syringa-950: #221c28;
  --color-strawberry-cheesecake: #ffddec;
  --color-strawberry-cheesecake-50: #ffedf5;
  --color-strawberry-cheesecake-100: #ffddec;
  --color-strawberry-cheesecake-200: #e6cdd8;
  --color-strawberry-cheesecake-300: #d2b6c2;
  --color-strawberry-cheesecake-400: #b496a4;
  --color-strawberry-cheesecake-500: #9a7b89;
  --color-strawberry-cheesecake-600: #7e626f;
  --color-strawberry-cheesecake-700: #664d58;
  --color-strawberry-cheesecake-800: #513b45;
  --color-strawberry-cheesecake-900: #3f2c35;
  --color-strawberry-cheesecake-950: #281b21;
}

Similar palettes