Start generating

Plum Intended to Minute Mauve color palette

633F4CPlum Intended845E77Indian SilkAC82A9Heart PotionA59BC8Imperial LilacD0CCE5Foggy PlateauF4E5FFMinute Mauve
Open in generator Export PNG, PDF, ASE…

About this palette

Plum Intended to Minute Mauve is a 6-color muted, gradient palette: #633F4C (Plum Intended), #845E77 (Indian Silk), #AC82A9 (Heart Potion), #A59BC8 (Imperial Lilac), #D0CCE5 (Foggy Plateau), #F4E5FF (Minute Mauve). It mixes red, pink, purple, gray, white tones and feels cool overall. The strongest text pairing is #633F4C on #F4E5FF with a contrast ratio of 7.46:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Plum Intendedrgb(99, 63, 76)hsl(338, 22%, 32%)
Indian Silkrgb(132, 94, 119)hsl(321, 17%, 44%)
Heart Potionrgb(172, 130, 169)hsl(304, 20%, 59%)
Imperial Lilacrgb(165, 155, 200)hsl(253, 29%, 70%)
Foggy Plateaurgb(208, 204, 229)hsl(250, 32%, 85%)
Minute Mauvergb(244, 229, 255)hsl(275, 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.

  • Aa7.46:1 Very good#633F4C on #F4E5FF
  • Aa7.46:1 Very good#F4E5FF on #633F4C
  • Aa5.73:1 Good#633F4C on #D0CCE5
  • Aa5.73:1 Good#D0CCE5 on #633F4C
  • Aa4.55:1 Good#845E77 on #F4E5FF
  • Aa4.55:1 Good#F4E5FF on #845E77
  • Aa3.49:1 Poor#845E77 on #D0CCE5
  • Aa3.49:1 Poor#D0CCE5 on #845E77

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Plum Intended to Minute Mauve — https://swatchly.xyz/palette/633f4c-845e77-ac82a9-a59bc8-d0cce5-f4e5ff */
:root {
  --plum-intended: #633f4c;
  --indian-silk: #845e77;
  --heart-potion: #ac82a9;
  --imperial-lilac: #a59bc8;
  --foggy-plateau: #d0cce5;
  --minute-mauve: #f4e5ff;
}

Tailwind CSS v4

/* Plum Intended to Minute Mauve — https://swatchly.xyz/palette/633f4c-845e77-ac82a9-a59bc8-d0cce5-f4e5ff */
@theme {
  --color-plum-intended: #633f4c;
  --color-plum-intended-50: #fff1f5;
  --color-plum-intended-100: #ffe3ec;
  --color-plum-intended-200: #eecdd8;
  --color-plum-intended-300: #dcb7c3;
  --color-plum-intended-400: #c098a6;
  --color-plum-intended-500: #a77e8c;
  --color-plum-intended-600: #8c6673;
  --color-plum-intended-700: #75515e;
  --color-plum-intended-800: #633f4c;
  --color-plum-intended-900: #4c313a;
  --color-plum-intended-950: #321e25;
  --color-indian-silk: #845e77;
  --color-indian-silk-50: #fff0f9;
  --color-indian-silk-100: #fee2f3;
  --color-indian-silk-200: #edcce1;
  --color-indian-silk-300: #d9b4cc;
  --color-indian-silk-400: #bb94ad;
  --color-indian-silk-500: #a07892;
  --color-indian-silk-600: #845e77;
  --color-indian-silk-700: #6b495f;
  --color-indian-silk-800: #55374b;
  --color-indian-silk-900: #422a3a;
  --color-indian-silk-950: #2a1924;
  --color-heart-potion: #ac82a9;
  --color-heart-potion-50: #fff3fe;
  --color-heart-potion-100: #ffe7fd;
  --color-heart-potion-200: #f2d2f0;
  --color-heart-potion-300: #e0bcdd;
  --color-heart-potion-400: #c59dc2;
  --color-heart-potion-500: #ac82a9;
  --color-heart-potion-600: #8e668b;
  --color-heart-potion-700: #734e70;
  --color-heart-potion-800: #5b3b59;
  --color-heart-potion-900: #462b45;
  --color-heart-potion-950: #2c192b;
  --color-imperial-lilac: #a59bc8;
  --color-imperial-lilac-50: #f6f4ff;
  --color-imperial-lilac-100: #ede8ff;
  --color-imperial-lilac-200: #dad3f6;
  --color-imperial-lilac-300: #c4bbe3;
  --color-imperial-lilac-400: #a59bc8;
  --color-imperial-lilac-500: #8980ab;
  --color-imperial-lilac-600: #6f658e;
  --color-imperial-lilac-700: #584f74;
  --color-imperial-lilac-800: #453d5d;
  --color-imperial-lilac-900: #352e49;
  --color-imperial-lilac-950: #201c2f;
  --color-foggy-plateau: #d0cce5;
  --color-foggy-plateau-50: #f0eefd;
  --color-foggy-plateau-100: #e5e2f3;
  --color-foggy-plateau-200: #d0cce5;
  --color-foggy-plateau-300: #bbb7cd;
  --color-foggy-plateau-400: #9d99b0;
  --color-foggy-plateau-500: #837f96;
  --color-foggy-plateau-600: #6a667c;
  --color-foggy-plateau-700: #545165;
  --color-foggy-plateau-800: #434051;
  --color-foggy-plateau-900: #33313f;
  --color-foggy-plateau-950: #1f1e28;
  --color-minute-mauve: #f4e5ff;
  --color-minute-mauve-50: #faf2ff;
  --color-minute-mauve-100: #f4e5ff;
  --color-minute-mauve-200: #ded3e6;
  --color-minute-mauve-300: #c8bcd1;
  --color-minute-mauve-400: #a99cb3;
  --color-minute-mauve-500: #8e8098;
  --color-minute-mauve-600: #73667c;
  --color-minute-mauve-700: #5c5064;
  --color-minute-mauve-800: #483e4f;
  --color-minute-mauve-900: #372f3e;
  --color-minute-mauve-950: #231c27;
}

Similar palettes