Melanzane to Grape Taffy Color Palette

About this palette

Melanzane to Grape Taffy is a 4-color muted palette: #392938 (Melanzane), #6E6F33 (Garden Weed), #83A997 (Catnip), #F2D8FD (Grape Taffy). It mixes gray, brown, green, purple tones and feels cool overall. The strongest text pairing is #392938 on #F2D8FD with a contrast ratio of 10.34:1, and 2 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Melanzane	rgb(57, 41, 56)	hsl(304, 16%, 19%)
Garden Weed	rgb(110, 111, 51)	hsl(61, 37%, 32%)
Catnip	rgb(131, 169, 151)	hsl(152, 18%, 59%)
Grape Taffy	rgb(242, 216, 253)	hsl(282, 90%, 92%)

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.

Aa10.34:1 Very good#392938 on #F2D8FD
Aa10.34:1 Very good#F2D8FD on #392938
Aa5.22:1 Good#392938 on #83A997
Aa5.22:1 Good#83A997 on #392938
Aa4.02:1 Poor#6E6F33 on #F2D8FD
Aa4.02:1 Poor#F2D8FD on #6E6F33

Color blindness preview

CSS variables

/* Melanzane to Grape Taffy — https://swatchly.xyz/palette/392938-6e6f33-83a997-f2d8fd */
:root {
  --melanzane: #392938;
  --garden-weed: #6e6f33;
  --catnip: #83a997;
  --grape-taffy: #f2d8fd;
}

Tailwind CSS v4

/* Melanzane to Grape Taffy — https://swatchly.xyz/palette/392938-6e6f33-83a997-f2d8fd */
@theme {
  --color-melanzane: #392938;
  --color-melanzane-50: #fdf1fc;
  --color-melanzane-100: #f4e6f2;
  --color-melanzane-200: #e1d2e0;
  --color-melanzane-300: #ccbacb;
  --color-melanzane-400: #ad9aab;
  --color-melanzane-500: #917e8f;
  --color-melanzane-600: #756374;
  --color-melanzane-700: #5d4d5c;
  --color-melanzane-800: #483a47;
  --color-melanzane-900: #392938;
  --color-melanzane-950: #211921;
  --color-garden-weed: #6e6f33;
  --color-garden-weed-50: #f6f8d6;
  --color-garden-weed-100: #edefc8;
  --color-garden-weed-200: #d9dbad;
  --color-garden-weed-300: #c3c590;
  --color-garden-weed-400: #a4a66b;
  --color-garden-weed-500: #888a4e;
  --color-garden-weed-600: #6e6f33;
  --color-garden-weed-700: #575821;
  --color-garden-weed-800: #444514;
  --color-garden-weed-900: #35350a;
  --color-garden-weed-950: #212103;
  --color-catnip: #83a997;
  --color-catnip-50: #e4faef;
  --color-catnip-100: #d8f1e4;
  --color-catnip-200: #c0decf;
  --color-catnip-300: #a6c8b8;
  --color-catnip-400: #83a997;
  --color-catnip-500: #698e7c;
  --color-catnip-600: #507363;
  --color-catnip-700: #3c5c4e;
  --color-catnip-800: #2c493c;
  --color-catnip-900: #20382e;
  --color-catnip-950: #12241c;
  --color-grape-taffy: #f2d8fd;
  --color-grape-taffy-50: #f7e8fe;
  --color-grape-taffy-100: #f2d8fd;
  --color-grape-taffy-200: #dcc8e5;
  --color-grape-taffy-300: #c8b2d2;
  --color-grape-taffy-400: #ab94b5;
  --color-grape-taffy-500: #917a9b;
  --color-grape-taffy-600: #776181;
  --color-grape-taffy-700: #614c69;
  --color-grape-taffy-800: #4c3b54;
  --color-grape-taffy-900: #3b2c41;
  --color-grape-taffy-950: #251a2a;
}