Mental Floss to Minute Mauve Color Palette

About this palette

Mental Floss to Minute Mauve is a 4-color pastel, light palette: #DAB7C7 (Mental Floss), #F0C8E0 (LA Vibes), #D6E0BD (April Showers), #ECE4FF (Minute Mauve). It mixes pink, green, purple tones and feels balanced overall. The strongest text pairing is #DAB7C7 on #ECE4FF with a contrast ratio of 1.48:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Mental Floss	rgb(218, 183, 199)	hsl(333, 32%, 79%)
LA Vibes	rgb(240, 200, 224)	hsl(324, 57%, 86%)
April Showers	rgb(214, 224, 189)	hsl(77, 36%, 81%)
Minute Mauve	rgb(236, 228, 255)	hsl(258, 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.

Color blindness preview

CSS variables

/* Mental Floss to Minute Mauve — https://swatchly.xyz/palette/dab7c7-f0c8e0-d6e0bd-ece4ff */
:root {
  --mental-floss: #dab7c7;
  --la-vibes: #f0c8e0;
  --april-showers: #d6e0bd;
  --minute-mauve: #ece4ff;
}

Tailwind CSS v4

/* Mental Floss to Minute Mauve — https://swatchly.xyz/palette/dab7c7-f0c8e0-d6e0bd-ece4ff */
@theme {
  --color-mental-floss: #dab7c7;
  --color-mental-floss-50: #fff2f8;
  --color-mental-floss-100: #fce5ef;
  --color-mental-floss-200: #ebd0dc;
  --color-mental-floss-300: #dab7c7;
  --color-mental-floss-400: #b898a7;
  --color-mental-floss-500: #9d7c8b;
  --color-mental-floss-600: #816271;
  --color-mental-floss-700: #684c59;
  --color-mental-floss-800: #523a46;
  --color-mental-floss-900: #402c36;
  --color-mental-floss-950: #291a21;
  --color-la-vibes: #f0c8e0;
  --color-la-vibes-50: #ffeef8;
  --color-la-vibes-100: #fbe1f0;
  --color-la-vibes-200: #f0c8e0;
  --color-la-vibes-300: #d6b4c8;
  --color-la-vibes-400: #b894aa;
  --color-la-vibes-500: #9d798f;
  --color-la-vibes-600: #815f74;
  --color-la-vibes-700: #694a5d;
  --color-la-vibes-800: #543949;
  --color-la-vibes-900: #412b39;
  --color-la-vibes-950: #2a1924;
  --color-april-showers: #d6e0bd;
  --color-april-showers-50: #f5fae7;
  --color-april-showers-100: #ebf1dc;
  --color-april-showers-200: #d6e0bd;
  --color-april-showers-300: #c0c8ab;
  --color-april-showers-400: #9fa888;
  --color-april-showers-500: #838c6c;
  --color-april-showers-600: #697152;
  --color-april-showers-700: #525a3e;
  --color-april-showers-800: #3f462d;
  --color-april-showers-900: #303621;
  --color-april-showers-950: #1d2112;
  --color-minute-mauve: #ece4ff;
  --color-minute-mauve-50: #f5f1ff;
  --color-minute-mauve-100: #ece4ff;
  --color-minute-mauve-200: #d8d2e6;
  --color-minute-mauve-300: #c2bbd2;
  --color-minute-mauve-400: #a39cb4;
  --color-minute-mauve-500: #888199;
  --color-minute-mauve-600: #6e677e;
  --color-minute-mauve-700: #585166;
  --color-minute-mauve-800: #443f51;
  --color-minute-mauve-900: #35303f;
  --color-minute-mauve-950: #211d28;
}