Garden Goddess to Breaking the Ice Color Palette

About this palette

Garden Goddess to Breaking the Ice is a 4-color pastel, light, cool palette: #97D0AC (Garden Goddess), #F7E0FF (Minute Mauve), #FEDAA5 (Dumpling), #B3E6F8 (Breaking the Ice). It mixes green, purple, yellow, blue tones and feels cool overall. The strongest text pairing is #97D0AC on #F7E0FF with a contrast ratio of 1.43:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Garden Goddess	rgb(151, 208, 172)	hsl(142, 38%, 70%)
Minute Mauve	rgb(247, 224, 255)	hsl(285, 100%, 94%)
Dumpling	rgb(254, 218, 165)	hsl(36, 98%, 82%)
Breaking the Ice	rgb(179, 230, 248)	hsl(196, 83%, 84%)

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

/* Garden Goddess to Breaking the Ice — https://swatchly.xyz/palette/97d0ac-f7e0ff-fedaa5-b3e6f8 */
:root {
  --garden-goddess: #97d0ac;
  --minute-mauve: #f7e0ff;
  --dumpling: #fedaa5;
  --breaking-the-ice: #b3e6f8;
}

Tailwind CSS v4

/* Garden Goddess to Breaking the Ice — https://swatchly.xyz/palette/97d0ac-f7e0ff-fedaa5-b3e6f8 */
@theme {
  --color-garden-goddess: #97d0ac;
  --color-garden-goddess-50: #dffee9;
  --color-garden-goddess-100: #d2f5de;
  --color-garden-goddess-200: #b9e3c8;
  --color-garden-goddess-300: #97d0ac;
  --color-garden-goddess-400: #7aaf8e;
  --color-garden-goddess-500: #5d9473;
  --color-garden-goddess-600: #447959;
  --color-garden-goddess-700: #306144;
  --color-garden-goddess-800: #214d34;
  --color-garden-goddess-900: #163b26;
  --color-garden-goddess-950: #0a2516;
  --color-minute-mauve: #f7e0ff;
  --color-minute-mauve-50: #fbefff;
  --color-minute-mauve-100: #f7e0ff;
  --color-minute-mauve-200: #e0cfe6;
  --color-minute-mauve-300: #cbb8d2;
  --color-minute-mauve-400: #ad98b4;
  --color-minute-mauve-500: #927d99;
  --color-minute-mauve-600: #77637e;
  --color-minute-mauve-700: #604e66;
  --color-minute-mauve-800: #4b3c51;
  --color-minute-mauve-900: #3a2d3f;
  --color-minute-mauve-950: #251b28;
  --color-dumpling: #fedaa5;
  --color-dumpling-50: #fffaf3;
  --color-dumpling-100: #fff0db;
  --color-dumpling-200: #fedaa5;
  --color-dumpling-300: #e0c399;
  --color-dumpling-400: #c2a171;
  --color-dumpling-500: #a58452;
  --color-dumpling-600: #886837;
  --color-dumpling-700: #6d5122;
  --color-dumpling-800: #563d13;
  --color-dumpling-900: #432e0a;
  --color-dumpling-950: #2b1c03;
  --color-breaking-the-ice: #b3e6f8;
  --color-breaking-the-ice-50: #effbff;
  --color-breaking-the-ice-100: #d9f5ff;
  --color-breaking-the-ice-200: #b3e6f8;
  --color-breaking-the-ice-300: #a3cddc;
  --color-breaking-the-ice-400: #7eadbd;
  --color-breaking-the-ice-500: #6091a1;
  --color-breaking-the-ice-600: #467585;
  --color-breaking-the-ice-700: #315d6b;
  --color-breaking-the-ice-800: #224855;
  --color-breaking-the-ice-900: #173842;
  --color-breaking-the-ice-950: #0b232a;
}