8 Bit Eggplant to Pink Punk color palette

96006C8 Bit Eggplant 3C062EDark Sanctuary D42E9CMelodramatic Magenta FFE3F2Bunny Tail E27CB7Pink Punk

Open in generator Export PNG, PDF, ASE…

About this palette

8 Bit Eggplant to Pink Punk is a 5-color warm, monochromatic palette: #96006C (8 Bit Eggplant), #3C062E (Dark Sanctuary), #D42E9C (Melodramatic Magenta), #FFE3F2 (Bunny Tail), #E27CB7 (Pink Punk). It mixes red, white, pink tones and feels warm overall. The strongest text pairing is #3C062E on #FFE3F2 with a contrast ratio of 13.93:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
8 Bit Eggplant	rgb(150, 0, 108)	hsl(317, 100%, 29%)
Dark Sanctuary	rgb(60, 6, 46)	hsl(316, 82%, 13%)
Melodramatic Magenta	rgb(212, 46, 156)	hsl(320, 66%, 51%)
Bunny Tail	rgb(255, 227, 242)	hsl(328, 100%, 95%)
Pink Punk	rgb(226, 124, 183)	hsl(325, 64%, 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.

Aa13.93:1 Super#3C062E on #FFE3F2
Aa13.93:1 Super#FFE3F2 on #3C062E
Aa6.97:1 Good#96006C on #FFE3F2
Aa6.97:1 Good#FFE3F2 on #96006C
Aa6.20:1 Good#3C062E on #E27CB7
Aa6.20:1 Good#E27CB7 on #3C062E
Aa3.75:1 Poor#D42E9C on #FFE3F2
Aa3.75:1 Poor#FFE3F2 on #D42E9C

Color blindness preview

CSS variables

/* 8 Bit Eggplant to Pink Punk — https://swatchly.xyz/palette/96006c-3c062e-d42e9c-ffe3f2-e27cb7 */
:root {
  --c-8-bit-eggplant: #96006c;
  --dark-sanctuary: #3c062e;
  --melodramatic-magenta: #d42e9c;
  --bunny-tail: #ffe3f2;
  --pink-punk: #e27cb7;
}

Tailwind CSS v4

/* 8 Bit Eggplant to Pink Punk — https://swatchly.xyz/palette/96006c-3c062e-d42e9c-ffe3f2-e27cb7 */
@theme {
  --color-c-8-bit-eggplant: #96006c;
  --color-c-8-bit-eggplant-50: #fff0f8;
  --color-c-8-bit-eggplant-100: #ffe2f1;
  --color-c-8-bit-eggplant-200: #ffc3e3;
  --color-c-8-bit-eggplant-300: #ff9bd5;
  --color-c-8-bit-eggplant-400: #ee6bbb;
  --color-c-8-bit-eggplant-500: #d04a9f;
  --color-c-8-bit-eggplant-600: #b02d83;
  --color-c-8-bit-eggplant-700: #96006c;
  --color-c-8-bit-eggplant-800: #760155;
  --color-c-8-bit-eggplant-900: #5d0042;
  --color-c-8-bit-eggplant-950: #3d002a;
  --color-dark-sanctuary: #3c062e;
  --color-dark-sanctuary-50: #fff0f9;
  --color-dark-sanctuary-100: #ffe1f3;
  --color-dark-sanctuary-200: #f9c6e5;
  --color-dark-sanctuary-300: #e6add1;
  --color-dark-sanctuary-400: #c98bb2;
  --color-dark-sanctuary-500: #ad6f98;
  --color-dark-sanctuary-600: #91567d;
  --color-dark-sanctuary-700: #774165;
  --color-dark-sanctuary-800: #603150;
  --color-dark-sanctuary-900: #4c243f;
  --color-dark-sanctuary-950: #3c062e;
  --color-melodramatic-magenta: #d42e9c;
  --color-melodramatic-magenta-50: #ffeff7;
  --color-melodramatic-magenta-100: #ffdeef;
  --color-melodramatic-magenta-200: #ffbde1;
  --color-melodramatic-magenta-300: #ff93d1;
  --color-melodramatic-magenta-400: #f355b9;
  --color-melodramatic-magenta-500: #d42e9c;
  --color-melodramatic-magenta-600: #b40081;
  --color-melodramatic-magenta-700: #900067;
  --color-melodramatic-magenta-800: #730051;
  --color-melodramatic-magenta-900: #5b003f;
  --color-melodramatic-magenta-950: #3c0028;
  --color-bunny-tail: #ffe3f2;
  --color-bunny-tail-50: #fff2f9;
  --color-bunny-tail-100: #ffe3f2;
  --color-bunny-tail-200: #e6d2dc;
  --color-bunny-tail-300: #d1bac6;
  --color-bunny-tail-400: #b39aa7;
  --color-bunny-tail-500: #977e8c;
  --color-bunny-tail-600: #7c6471;
  --color-bunny-tail-700: #634e5a;
  --color-bunny-tail-800: #4e3c46;
  --color-bunny-tail-900: #3d2d36;
  --color-bunny-tail-950: #271b22;
  --color-pink-punk: #e27cb7;
  --color-pink-punk-50: #fff2f8;
  --color-pink-punk-100: #ffe3f1;
  --color-pink-punk-200: #ffc5e4;
  --color-pink-punk-300: #fba2d4;
  --color-pink-punk-400: #e27cb7;
  --color-pink-punk-500: #c3609a;
  --color-pink-punk-600: #a4457f;
  --color-pink-punk-700: #873166;
  --color-pink-punk-800: #6d2151;
  --color-pink-punk-900: #56153f;
  --color-pink-punk-950: #380928;
}