Turquoise to Grape Taffy Color Palette

About this palette

Turquoise to Grape Taffy is a 5-color vibrant, light, cool, neon palette: #00C19E (Turquoise), #00D148 (Walled Garden), #FF91B0 (Rock’n’Rose), #00F1E7 (Frozen Boubble), #F8D9FF (Grape Taffy). It mixes turquoise, green, pink, purple tones and feels cool overall. The strongest text pairing is #00C19E on #F8D9FF with a contrast ratio of 1.79:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Turquoise	rgb(0, 193, 158)	hsl(169, 100%, 38%)
Walled Garden	rgb(0, 209, 72)	hsl(141, 100%, 41%)
Rock’n’Rose	rgb(255, 145, 176)	hsl(343, 100%, 78%)
Frozen Boubble	rgb(0, 241, 231)	hsl(178, 100%, 47%)
Grape Taffy	rgb(248, 217, 255)	hsl(289, 100%, 93%)

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

/* Turquoise to Grape Taffy — https://swatchly.xyz/palette/00c19e-00d148-ff91b0-00f1e7-f8d9ff */
:root {
  --turquoise: #00c19e;
  --walled-garden: #00d148;
  --rock-n-rose: #ff91b0;
  --frozen-boubble: #00f1e7;
  --grape-taffy: #f8d9ff;
}

Tailwind CSS v4

/* Turquoise to Grape Taffy — https://swatchly.xyz/palette/00c19e-00d148-ff91b0-00f1e7-f8d9ff */
@theme {
  --color-turquoise: #00c19e;
  --color-turquoise-50: #dffff4;
  --color-turquoise-100: #b7ffe9;
  --color-turquoise-200: #90f0d5;
  --color-turquoise-300: #68ddbe;
  --color-turquoise-400: #00c19e;
  --color-turquoise-500: #00a183;
  --color-turquoise-600: #008169;
  --color-turquoise-700: #006753;
  --color-turquoise-800: #005040;
  --color-turquoise-900: #003d31;
  --color-turquoise-950: #00261d;
  --color-walled-garden: #00d148;
  --color-walled-garden-50: #eeffef;
  --color-walled-garden-100: #d5ffd7;
  --color-walled-garden-200: #96fca0;
  --color-walled-garden-300: #70ea80;
  --color-walled-garden-400: #00d148;
  --color-walled-garden-500: #00ae3a;
  --color-walled-garden-600: #008c2d;
  --color-walled-garden-700: #006e22;
  --color-walled-garden-800: #005618;
  --color-walled-garden-900: #004110;
  --color-walled-garden-950: #002807;
  --color-rock-n-rose: #ff91b0;
  --color-rock-n-rose-50: #ffeaef;
  --color-rock-n-rose-100: #ffdae2;
  --color-rock-n-rose-200: #ffbacb;
  --color-rock-n-rose-300: #ff91b0;
  --color-rock-n-rose-400: #dc7593;
  --color-rock-n-rose-500: #c15979;
  --color-rock-n-rose-600: #a34161;
  --color-rock-n-rose-700: #872e4c;
  --color-rock-n-rose-800: #6e203c;
  --color-rock-n-rose-900: #59152e;
  --color-rock-n-rose-950: #3b0a1c;
  --color-frozen-boubble: #00f1e7;
  --color-frozen-boubble-50: #c5fffa;
  --color-frozen-boubble-100: #96fcf4;
  --color-frozen-boubble-200: #00f1e7;
  --color-frozen-boubble-300: #2dd7ce;
  --color-frozen-boubble-400: #00b6ae;
  --color-frozen-boubble-500: #009891;
  --color-frozen-boubble-600: #007b75;
  --color-frozen-boubble-700: #00625e;
  --color-frozen-boubble-800: #004d4a;
  --color-frozen-boubble-900: #003c39;
  --color-frozen-boubble-950: #002523;
  --color-grape-taffy: #f8d9ff;
  --color-grape-taffy-50: #fbe9ff;
  --color-grape-taffy-100: #f8d9ff;
  --color-grape-taffy-200: #e1c9e6;
  --color-grape-taffy-300: #cdb3d3;
  --color-grape-taffy-400: #af93b6;
  --color-grape-taffy-500: #95799b;
  --color-grape-taffy-600: #7b6081;
  --color-grape-taffy-700: #634b69;
  --color-grape-taffy-800: #4f3953;
  --color-grape-taffy-900: #3d2b41;
  --color-grape-taffy-950: #271a29;
}