Cinderella to Minty Fresh Color Palette

About this palette

Cinderella to Minty Fresh is a 5-color pastel, light, cool palette: #FFD4C9 (Cinderella), #FFEAFD (Strawberry Bonbon), #99D7F3 (Over the Sky), #B1D2C0 (Frosted Fir), #D2F5E2 (Minty Fresh). It mixes pink, white, blue, green tones and feels cool overall. The strongest text pairing is #FFEAFD on #B1D2C0 with a contrast ratio of 1.44:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Cinderella	rgb(255, 212, 201)	hsl(12, 100%, 89%)
Strawberry Bonbon	rgb(255, 234, 253)	hsl(306, 100%, 96%)
Over the Sky	rgb(153, 215, 243)	hsl(199, 79%, 78%)
Frosted Fir	rgb(177, 210, 192)	hsl(147, 27%, 76%)
Minty Fresh	rgb(210, 245, 226)	hsl(147, 64%, 89%)

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

/* Cinderella to Minty Fresh — https://swatchly.xyz/palette/ffd4c9-ffeafd-99d7f3-b1d2c0-d2f5e2 */
:root {
  --cinderella: #ffd4c9;
  --strawberry-bonbon: #ffeafd;
  --over-the-sky: #99d7f3;
  --frosted-fir: #b1d2c0;
  --minty-fresh: #d2f5e2;
}

Tailwind CSS v4

/* Cinderella to Minty Fresh — https://swatchly.xyz/palette/ffd4c9-ffeafd-99d7f3-b1d2c0-d2f5e2 */
@theme {
  --color-cinderella: #ffd4c9;
  --color-cinderella-50: #fff9f7;
  --color-cinderella-100: #ffede9;
  --color-cinderella-200: #ffd4c9;
  --color-cinderella-300: #e1beb5;
  --color-cinderella-400: #c39c92;
  --color-cinderella-500: #a67f75;
  --color-cinderella-600: #89645b;
  --color-cinderella-700: #6e4d45;
  --color-cinderella-800: #573a33;
  --color-cinderella-900: #442c26;
  --color-cinderella-950: #2c1a16;
  --color-strawberry-bonbon: #ffeafd;
  --color-strawberry-bonbon-50: #ffeafd;
  --color-strawberry-bonbon-100: #f1e3ef;
  --color-strawberry-bonbon-200: #dfd0de;
  --color-strawberry-bonbon-300: #cab9c9;
  --color-strawberry-bonbon-400: #ac9aab;
  --color-strawberry-bonbon-500: #917f90;
  --color-strawberry-bonbon-600: #776575;
  --color-strawberry-bonbon-700: #5f4f5e;
  --color-strawberry-bonbon-800: #4b3d4a;
  --color-strawberry-bonbon-900: #3a2e39;
  --color-strawberry-bonbon-950: #241c24;
  --color-over-the-sky: #99d7f3;
  --color-over-the-sky-50: #d9f3ff;
  --color-over-the-sky-100: #c0e9fd;
  --color-over-the-sky-200: #99d7f3;
  --color-over-the-sky-300: #8bc1da;
  --color-over-the-sky-400: #69a4be;
  --color-over-the-sky-500: #4e8aa4;
  --color-over-the-sky-600: #367189;
  --color-over-the-sky-700: #235b71;
  --color-over-the-sky-800: #16495c;
  --color-over-the-sky-900: #0c3849;
  --color-over-the-sky-950: #04232f;
  --color-frosted-fir: #b1d2c0;
  --color-frosted-fir-50: #edfef4;
  --color-frosted-fir-100: #e3f6eb;
  --color-frosted-fir-200: #cee5d8;
  --color-frosted-fir-300: #b1d2c0;
  --color-frosted-fir-400: #92b0a0;
  --color-frosted-fir-500: #749483;
  --color-frosted-fir-600: #597768;
  --color-frosted-fir-700: #435f50;
  --color-frosted-fir-800: #324a3d;
  --color-frosted-fir-900: #24382e;
  --color-frosted-fir-950: #14231c;
  --color-minty-fresh: #d2f5e2;
  --color-minty-fresh-50: #e8fbf0;
  --color-minty-fresh-100: #d2f5e2;
  --color-minty-fresh-200: #c5dfd1;
  --color-minty-fresh-300: #acc9b9;
  --color-minty-fresh-400: #8baa99;
  --color-minty-fresh-500: #6f8f7e;
  --color-minty-fresh-600: #557464;
  --color-minty-fresh-700: #415d4e;
  --color-minty-fresh-800: #30493c;
  --color-minty-fresh-900: #23382e;
  --color-minty-fresh-950: #14231b;
}