Gum Leaf to Partial Pink Color Palette

About this palette

Gum Leaf to Partial Pink is a 4-color pastel, light, cool palette: #A6C9B3 (Gum Leaf), #A8E7E2 (Sea Glass Teal), #D4D9FF (Icy Plains), #FFEFF9 (Partial Pink). It mixes green, turquoise, purple, white tones and feels cool overall. The strongest text pairing is #A6C9B3 on #FFEFF9 with a contrast ratio of 1.63:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Gum Leaf	rgb(166, 201, 179)	hsl(142, 24%, 72%)
Sea Glass Teal	rgb(168, 231, 226)	hsl(175, 57%, 78%)
Icy Plains	rgb(212, 217, 255)	hsl(233, 100%, 92%)
Partial Pink	rgb(255, 239, 249)	hsl(322, 100%, 97%)

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

/* Gum Leaf to Partial Pink — https://swatchly.xyz/palette/a6c9b3-a8e7e2-d4d9ff-ffeff9 */
:root {
  --gum-leaf: #a6c9b3;
  --sea-glass-teal: #a8e7e2;
  --icy-plains: #d4d9ff;
  --partial-pink: #ffeff9;
}

Tailwind CSS v4

/* Gum Leaf to Partial Pink — https://swatchly.xyz/palette/a6c9b3-a8e7e2-d4d9ff-ffeff9 */
@theme {
  --color-gum-leaf: #a6c9b3;
  --color-gum-leaf-50: #e6faed;
  --color-gum-leaf-100: #daf0e2;
  --color-gum-leaf-200: #c3decd;
  --color-gum-leaf-300: #a6c9b3;
  --color-gum-leaf-400: #88a995;
  --color-gum-leaf-500: #6d8e7a;
  --color-gum-leaf-600: #547460;
  --color-gum-leaf-700: #405c4b;
  --color-gum-leaf-800: #2f493a;
  --color-gum-leaf-900: #23382c;
  --color-gum-leaf-950: #14231a;
  --color-sea-glass-teal: #a8e7e2;
  --color-sea-glass-teal-50: #ddfefb;
  --color-sea-glass-teal-100: #d0f5f2;
  --color-sea-glass-teal-200: #a8e7e2;
  --color-sea-glass-teal-300: #9aceca;
  --color-sea-glass-teal-400: #75afab;
  --color-sea-glass-teal-500: #57938f;
  --color-sea-glass-teal-600: #3c7874;
  --color-sea-glass-teal-700: #28605d;
  --color-sea-glass-teal-800: #194b49;
  --color-sea-glass-teal-900: #0e3a38;
  --color-sea-glass-teal-950: #052523;
  --color-icy-plains: #d4d9ff;
  --color-icy-plains-50: #f6f8ff;
  --color-icy-plains-100: #ebeeff;
  --color-icy-plains-200: #d4d9ff;
  --color-icy-plains-300: #bec2e1;
  --color-icy-plains-400: #9da2c4;
  --color-icy-plains-500: #8185a8;
  --color-icy-plains-600: #666a8b;
  --color-icy-plains-700: #505371;
  --color-icy-plains-800: #3d405a;
  --color-icy-plains-900: #2f3147;
  --color-icy-plains-950: #1c1e2d;
  --color-partial-pink: #ffeff9;
  --color-partial-pink-50: #ffeff9;
  --color-partial-pink-100: #f1e7ed;
  --color-partial-pink-200: #dfd3da;
  --color-partial-pink-300: #c9bcc4;
  --color-partial-pink-400: #ab9ca5;
  --color-partial-pink-500: #8f818a;
  --color-partial-pink-600: #756770;
  --color-partial-pink-700: #5d5159;
  --color-partial-pink-800: #493f45;
  --color-partial-pink-900: #393035;
  --color-partial-pink-950: #231d21;
}