Icy Breeze to Water Nymph Color Palette

About this palette

Icy Breeze to Water Nymph is a 5-color pastel, light, cool palette: #BDECF5 (Icy Breeze), #C5FDD6 (Toxic Steam), #FFDAE6 (Pink Supremecy), #E5C196 (Laksa), #7FD1DF (Water Nymph). It mixes turquoise, green, pink, orange tones and feels cool overall. The strongest text pairing is #C5FDD6 on #7FD1DF with a contrast ratio of 1.52:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Icy Breeze	rgb(189, 236, 245)	hsl(190, 74%, 85%)
Toxic Steam	rgb(197, 253, 214)	hsl(138, 93%, 88%)
Pink Supremecy	rgb(255, 218, 230)	hsl(341, 100%, 93%)
Laksa	rgb(229, 193, 150)	hsl(33, 60%, 74%)
Water Nymph	rgb(127, 209, 223)	hsl(189, 60%, 69%)

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

/* Icy Breeze to Water Nymph — https://swatchly.xyz/palette/bdecf5-c5fdd6-ffdae6-e5c196-7fd1df */
:root {
  --icy-breeze: #bdecf5;
  --toxic-steam: #c5fdd6;
  --pink-supremecy: #ffdae6;
  --laksa: #e5c196;
  --water-nymph: #7fd1df;
}

Tailwind CSS v4

/* Icy Breeze to Water Nymph — https://swatchly.xyz/palette/bdecf5-c5fdd6-ffdae6-e5c196-7fd1df */
@theme {
  --color-icy-breeze: #bdecf5;
  --color-icy-breeze-50: #d8f4f9;
  --color-icy-breeze-100: #bdecf5;
  --color-icy-breeze-200: #b4d8df;
  --color-icy-breeze-300: #9cc3cb;
  --color-icy-breeze-400: #7ba6ae;
  --color-icy-breeze-500: #608c94;
  --color-icy-breeze-600: #48727a;
  --color-icy-breeze-700: #355c64;
  --color-icy-breeze-800: #26494f;
  --color-icy-breeze-900: #1a383d;
  --color-icy-breeze-950: #0d2327;
  --color-toxic-steam: #c5fdd6;
  --color-toxic-steam-50: #e3ffeb;
  --color-toxic-steam-100: #c5fdd6;
  --color-toxic-steam-200: #bde5c8;
  --color-toxic-steam-300: #a1cfaf;
  --color-toxic-steam-400: #7db08e;
  --color-toxic-steam-500: #609572;
  --color-toxic-steam-600: #467958;
  --color-toxic-steam-700: #326143;
  --color-toxic-steam-800: #234c32;
  --color-toxic-steam-900: #183b25;
  --color-toxic-steam-950: #0b2515;
  --color-pink-supremecy: #ffdae6;
  --color-pink-supremecy-50: #ffeaf1;
  --color-pink-supremecy-100: #ffdae6;
  --color-pink-supremecy-200: #e6cad3;
  --color-pink-supremecy-300: #d3b4be;
  --color-pink-supremecy-400: #b6949f;
  --color-pink-supremecy-500: #9b7a85;
  --color-pink-supremecy-600: #80616b;
  --color-pink-supremecy-700: #684c56;
  --color-pink-supremecy-800: #533a43;
  --color-pink-supremecy-900: #412c33;
  --color-pink-supremecy-950: #291a1f;
  --color-laksa: #e5c196;
  --color-laksa-50: #fff7ef;
  --color-laksa-100: #ffedd8;
  --color-laksa-200: #f3d9ba;
  --color-laksa-300: #e5c196;
  --color-laksa-400: #c2a179;
  --color-laksa-500: #a5845b;
  --color-laksa-600: #886840;
  --color-laksa-700: #6e512c;
  --color-laksa-800: #573e1d;
  --color-laksa-900: #432e12;
  --color-laksa-950: #2b1c08;
  --color-water-nymph: #7fd1df;
  --color-water-nymph-50: #e3fbff;
  --color-water-nymph-100: #c6f6fe;
  --color-water-nymph-200: #aae4ee;
  --color-water-nymph-300: #7fd1df;
  --color-water-nymph-400: #62b0bd;
  --color-water-nymph-500: #4194a2;
  --color-water-nymph-600: #227986;
  --color-water-nymph-700: #06616d;
  --color-water-nymph-800: #004c56;
  --color-water-nymph-900: #003a42;
  --color-water-nymph-950: #00242a;
}