Night Snow to Candied Snow Color Palette

About this palette

Night Snow to Candied Snow is a 4-color pastel, light, cool palette: #AFC8FB (Night Snow), #EDBBE8 (Rosecco), #F5E9BE (Candle in the Wind), #DEFFEA (Candied Snow). It mixes blue, pink, yellow, white tones and feels cool overall. The strongest text pairing is #AFC8FB on #DEFFEA with a contrast ratio of 1.57:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Night Snow	rgb(175, 200, 251)	hsl(220, 90%, 84%)
Rosecco	rgb(237, 187, 232)	hsl(306, 58%, 83%)
Candle in the Wind	rgb(245, 233, 190)	hsl(47, 73%, 85%)
Candied Snow	rgb(222, 255, 234)	hsl(142, 100%, 94%)

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

/* Night Snow to Candied Snow — https://swatchly.xyz/palette/afc8fb-edbbe8-f5e9be-deffea */
:root {
  --night-snow: #afc8fb;
  --rosecco: #edbbe8;
  --candle-in-the-wind: #f5e9be;
  --candied-snow: #deffea;
}

Tailwind CSS v4

/* Night Snow to Candied Snow — https://swatchly.xyz/palette/afc8fb-edbbe8-f5e9be-deffea */
@theme {
  --color-night-snow: #afc8fb;
  --color-night-snow-50: #f6f9ff;
  --color-night-snow-100: #e9f0ff;
  --color-night-snow-200: #cddeff;
  --color-night-snow-300: #afc8fb;
  --color-night-snow-400: #90a7d6;
  --color-night-snow-500: #738aba;
  --color-night-snow-600: #596e9c;
  --color-night-snow-700: #435680;
  --color-night-snow-800: #324266;
  --color-night-snow-900: #243250;
  --color-night-snow-950: #151f34;
  --color-rosecco: #edbbe8;
  --color-rosecco-50: #ffe5fc;
  --color-rosecco-100: #f9d6f5;
  --color-rosecco-200: #edbbe8;
  --color-rosecco-300: #d4a9d0;
  --color-rosecco-400: #b88ab3;
  --color-rosecco-500: #9e709a;
  --color-rosecco-600: #83587f;
  --color-rosecco-700: #6b4468;
  --color-rosecco-800: #573454;
  --color-rosecco-900: #442742;
  --color-rosecco-950: #2b172a;
  --color-candle-in-the-wind: #f5e9be;
  --color-candle-in-the-wind-50: #faf3db;
  --color-candle-in-the-wind-100: #f5e9be;
  --color-candle-in-the-wind-200: #ded6b6;
  --color-candle-in-the-wind-300: #c9c09c;
  --color-candle-in-the-wind-400: #aba079;
  --color-candle-in-the-wind-500: #90855e;
  --color-candle-in-the-wind-600: #766b45;
  --color-candle-in-the-wind-700: #5f5532;
  --color-candle-in-the-wind-800: #4b4223;
  --color-candle-in-the-wind-900: #3a3318;
  --color-candle-in-the-wind-950: #241f0c;
  --color-candied-snow: #deffea;
  --color-candied-snow-50: #deffea;
  --color-candied-snow-100: #ddf1e4;
  --color-candied-snow-200: #c7dfcf;
  --color-candied-snow-300: #aec9b8;
  --color-candied-snow-400: #8caa97;
  --color-candied-snow-500: #718f7c;
  --color-candied-snow-600: #577462;
  --color-candied-snow-700: #425c4c;
  --color-candied-snow-800: #32493b;
  --color-candied-snow-900: #25382c;
  --color-candied-snow-950: #15231b;
}