Pastel Lilac to Drama Queen color palette

B4ACD2Pastel Lilac E5D3F5Scented Spring 583B56Long Passionate Night 352428Aubergine A37591Drama Queen

Open in generator Export PNG, PDF, ASE…

About this palette

Pastel Lilac to Drama Queen is a 5-color muted, cool palette: #B4ACD2 (Pastel Lilac), #E5D3F5 (Scented Spring), #583B56 (Long Passionate Night), #352428 (Aubergine), #A37591 (Drama Queen). It mixes purple, gray, pink tones and feels cool overall. The strongest text pairing is #E5D3F5 on #352428 with a contrast ratio of 10.44:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pastel Lilac	rgb(180, 172, 210)	hsl(253, 30%, 75%)
Scented Spring	rgb(229, 211, 245)	hsl(272, 63%, 89%)
Long Passionate Night	rgb(88, 59, 86)	hsl(304, 20%, 29%)
Aubergine	rgb(53, 36, 40)	hsl(346, 19%, 17%)
Drama Queen	rgb(163, 117, 145)	hsl(323, 20%, 55%)

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.

Aa10.44:1 Very good#E5D3F5 on #352428
Aa10.44:1 Very good#352428 on #E5D3F5
Aa6.88:1 Good#E5D3F5 on #583B56
Aa6.88:1 Good#583B56 on #E5D3F5
Aa6.81:1 Good#B4ACD2 on #352428
Aa6.81:1 Good#352428 on #B4ACD2
Aa4.49:1 Poor#B4ACD2 on #583B56
Aa4.49:1 Poor#583B56 on #B4ACD2

Color blindness preview

CSS variables

/* Pastel Lilac to Drama Queen — https://swatchly.xyz/palette/b4acd2-e5d3f5-583b56-352428-a37591 */
:root {
  --pastel-lilac: #b4acd2;
  --scented-spring: #e5d3f5;
  --long-passionate-night: #583b56;
  --aubergine: #352428;
  --drama-queen: #a37591;
}

Tailwind CSS v4

/* Pastel Lilac to Drama Queen — https://swatchly.xyz/palette/b4acd2-e5d3f5-583b56-352428-a37591 */
@theme {
  --color-pastel-lilac: #b4acd2;
  --color-pastel-lilac-50: #eeeaff;
  --color-pastel-lilac-100: #e2ddf8;
  --color-pastel-lilac-200: #ccc6e5;
  --color-pastel-lilac-300: #b4acd2;
  --color-pastel-lilac-400: #9790b4;
  --color-pastel-lilac-500: #7f779b;
  --color-pastel-lilac-600: #675f81;
  --color-pastel-lilac-700: #534c6a;
  --color-pastel-lilac-800: #423c56;
  --color-pastel-lilac-900: #342f45;
  --color-pastel-lilac-950: #201c2d;
  --color-scented-spring: #e5d3f5;
  --color-scented-spring-50: #faf5ff;
  --color-scented-spring-100: #f4e9fe;
  --color-scented-spring-200: #e5d3f5;
  --color-scented-spring-300: #ccbdd9;
  --color-scented-spring-400: #ad9cbb;
  --color-scented-spring-500: #91809f;
  --color-scented-spring-600: #756583;
  --color-scented-spring-700: #5d4f6a;
  --color-scented-spring-800: #493c53;
  --color-scented-spring-900: #382e41;
  --color-scented-spring-950: #231c2a;
  --color-long-passionate-night: #583b56;
  --color-long-passionate-night-50: #fff0fd;
  --color-long-passionate-night-100: #f9e3f7;
  --color-long-passionate-night-200: #e8cee6;
  --color-long-passionate-night-300: #d4b7d2;
  --color-long-passionate-night-400: #b797b5;
  --color-long-passionate-night-500: #9d7c9a;
  --color-long-passionate-night-600: #82637f;
  --color-long-passionate-night-700: #6a4e68;
  --color-long-passionate-night-800: #583b56;
  --color-long-passionate-night-900: #432e42;
  --color-long-passionate-night-950: #2b1c2a;
  --color-aubergine: #352428;
  --color-aubergine-50: #fef1f4;
  --color-aubergine-100: #f6e7ea;
  --color-aubergine-200: #e4d2d6;
  --color-aubergine-300: #cfbbbf;
  --color-aubergine-400: #ae999e;
  --color-aubergine-500: #917c81;
  --color-aubergine-600: #746065;
  --color-aubergine-700: #5a494d;
  --color-aubergine-800: #443639;
  --color-aubergine-900: #352428;
  --color-aubergine-950: #1d1617;
  --color-drama-queen: #a37591;
  --color-drama-queen-50: #fff0f9;
  --color-drama-queen-100: #ffe1f2;
  --color-drama-queen-200: #f0cae1;
  --color-drama-queen-300: #dcb2cb;
  --color-drama-queen-400: #bf91ac;
  --color-drama-queen-500: #a37591;
  --color-drama-queen-600: #875b76;
  --color-drama-queen-700: #6d465f;
  --color-drama-queen-800: #57354b;
  --color-drama-queen-900: #44283a;
  --color-drama-queen-950: #2c1724;
}