Fly a Kite to Porcelain Skin Color Palette

About this palette

Fly a Kite to Porcelain Skin is a 4-color pastel, light palette: #CDD9F5 (Fly a Kite), #E7C6D5 (Tussie-Mussie), #DDC186 (Sunspill), #FFE6EA (Porcelain Skin). It mixes blue, pink, yellow, white tones and feels warm overall. The strongest text pairing is #DDC186 on #FFE6EA with a contrast ratio of 1.47:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Fly a Kite	rgb(205, 217, 245)	hsl(222, 67%, 88%)
Tussie-Mussie	rgb(231, 198, 213)	hsl(333, 41%, 84%)
Sunspill	rgb(221, 193, 134)	hsl(41, 56%, 70%)
Porcelain Skin	rgb(255, 230, 234)	hsl(350, 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

/* Fly a Kite to Porcelain Skin — https://swatchly.xyz/palette/cdd9f5-e7c6d5-ddc186-ffe6ea */
:root {
  --fly-a-kite: #cdd9f5;
  --tussie-mussie: #e7c6d5;
  --sunspill: #ddc186;
  --porcelain-skin: #ffe6ea;
}

Tailwind CSS v4

/* Fly a Kite to Porcelain Skin — https://swatchly.xyz/palette/cdd9f5-e7c6d5-ddc186-ffe6ea */
@theme {
  --color-fly-a-kite: #cdd9f5;
  --color-fly-a-kite-50: #f2f6ff;
  --color-fly-a-kite-100: #e5edfe;
  --color-fly-a-kite-200: #cdd9f5;
  --color-fly-a-kite-300: #b8c2d9;
  --color-fly-a-kite-400: #98a2bc;
  --color-fly-a-kite-500: #7c87a0;
  --color-fly-a-kite-600: #626c84;
  --color-fly-a-kite-700: #4c556b;
  --color-fly-a-kite-800: #3a4255;
  --color-fly-a-kite-900: #2c3343;
  --color-fly-a-kite-950: #1a1f2b;
  --color-tussie-mussie: #e7c6d5;
  --color-tussie-mussie-50: #feeaf3;
  --color-tussie-mussie-100: #f5dee8;
  --color-tussie-mussie-200: #e7c6d5;
  --color-tussie-mussie-300: #cfb2bf;
  --color-tussie-mussie-400: #b293a1;
  --color-tussie-mussie-500: #977987;
  --color-tussie-mussie-600: #7d606e;
  --color-tussie-mussie-700: #654c58;
  --color-tussie-mussie-800: #513b45;
  --color-tussie-mussie-900: #3f2c35;
  --color-tussie-mussie-950: #281b21;
  --color-sunspill: #ddc186;
  --color-sunspill-50: #fff6e4;
  --color-sunspill-100: #fdecc9;
  --color-sunspill-200: #edd8ae;
  --color-sunspill-300: #ddc186;
  --color-sunspill-400: #bba16a;
  --color-sunspill-500: #9f854b;
  --color-sunspill-600: #836a31;
  --color-sunspill-700: #6a531d;
  --color-sunspill-800: #54400e;
  --color-sunspill-900: #413005;
  --color-sunspill-950: #291d01;
  --color-porcelain-skin: #ffe6ea;
  --color-porcelain-skin-50: #fff4f5;
  --color-porcelain-skin-100: #ffe6ea;
  --color-porcelain-skin-200: #e6d4d7;
  --color-porcelain-skin-300: #d1bcc0;
  --color-porcelain-skin-400: #b29ca0;
  --color-porcelain-skin-500: #968084;
  --color-porcelain-skin-600: #7b6669;
  --color-porcelain-skin-700: #625053;
  --color-porcelain-skin-800: #4e3d40;
  --color-porcelain-skin-900: #3c2f31;
  --color-porcelain-skin-950: #261c1e;
}