Partial Pink to Purple Prose Color Palette

About this palette

Partial Pink to Purple Prose is a 4-color warm, vintage, monochromatic, gradient palette: #FFEFF8 (Partial Pink), #E89DD5 (Pearly Pink), #8D5F82 (Sunshone Plum), #5D284D (Purple Prose). It mixes white, pink, red tones and feels warm overall. The strongest text pairing is #FFEFF8 on #5D284D with a contrast ratio of 10.10:1, and 3 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Partial Pink	rgb(255, 239, 248)	hsl(326, 100%, 97%)
Pearly Pink	rgb(232, 157, 213)	hsl(315, 62%, 76%)
Sunshone Plum	rgb(141, 95, 130)	hsl(314, 19%, 46%)
Purple Prose	rgb(93, 40, 77)	hsl(318, 40%, 26%)

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.10:1 Very good#FFEFF8 on #5D284D
Aa10.10:1 Very good#5D284D on #FFEFF8
Aa5.44:1 Good#E89DD5 on #5D284D
Aa5.44:1 Good#5D284D on #E89DD5
Aa4.63:1 Good#FFEFF8 on #8D5F82
Aa4.63:1 Good#8D5F82 on #FFEFF8

Color blindness preview

CSS variables

/* Partial Pink to Purple Prose — https://swatchly.xyz/palette/ffeff8-e89dd5-8d5f82-5d284d */
:root {
  --partial-pink: #ffeff8;
  --pearly-pink: #e89dd5;
  --sunshone-plum: #8d5f82;
  --purple-prose: #5d284d;
}

Tailwind CSS v4

/* Partial Pink to Purple Prose — https://swatchly.xyz/palette/ffeff8-e89dd5-8d5f82-5d284d */
@theme {
  --color-partial-pink: #ffeff8;
  --color-partial-pink-50: #ffeff8;
  --color-partial-pink-100: #f1e7ed;
  --color-partial-pink-200: #dfd3da;
  --color-partial-pink-300: #c9bcc4;
  --color-partial-pink-400: #ab9da5;
  --color-partial-pink-500: #908189;
  --color-partial-pink-600: #75676f;
  --color-partial-pink-700: #5d5158;
  --color-partial-pink-800: #493f45;
  --color-partial-pink-900: #393035;
  --color-partial-pink-950: #231d21;
  --color-pearly-pink: #e89dd5;
  --color-pearly-pink-50: #ffeaf9;
  --color-pearly-pink-100: #ffd9f4;
  --color-pearly-pink-200: #f7bbe7;
  --color-pearly-pink-300: #e89dd5;
  --color-pearly-pink-400: #c780b5;
  --color-pearly-pink-500: #ac669b;
  --color-pearly-pink-600: #904d80;
  --color-pearly-pink-700: #763a69;
  --color-pearly-pink-800: #602b54;
  --color-pearly-pink-900: #4c1f43;
  --color-pearly-pink-950: #32112b;
  --color-sunshone-plum: #8d5f82;
  --color-sunshone-plum-50: #fff0fb;
  --color-sunshone-plum-100: #ffe2f7;
  --color-sunshone-plum-200: #f2cce8;
  --color-sunshone-plum-300: #dfb4d4;
  --color-sunshone-plum-400: #c394b7;
  --color-sunshone-plum-500: #a8789c;
  --color-sunshone-plum-600: #8d5f82;
  --color-sunshone-plum-700: #724969;
  --color-sunshone-plum-800: #5b3753;
  --color-sunshone-plum-900: #472940;
  --color-sunshone-plum-950: #2e1829;
  --color-purple-prose: #5d284d;
  --color-purple-prose-50: #fff0f9;
  --color-purple-prose-100: #ffe1f4;
  --color-purple-prose-200: #f7c7e5;
  --color-purple-prose-300: #e4add0;
  --color-purple-prose-400: #c68ab1;
  --color-purple-prose-500: #a96d95;
  --color-purple-prose-600: #8b5379;
  --color-purple-prose-700: #703e60;
  --color-purple-prose-800: #5d284d;
  --color-purple-prose-900: #45213a;
  --color-purple-prose-950: #2c1224;
}