Ayahuasca Vine to Balsamico Color Palette

About this palette

Ayahuasca Vine to Balsamico is a 4-color dark, gradient palette: #6E5100 (Ayahuasca Vine), #2C3F27 (Everglade), #003433 (Elite Teal), #130C00 (Balsamico). It mixes brown, green, turquoise, black tones and feels cool overall. The strongest text pairing is #6E5100 on #130C00 with a contrast ratio of 2.63:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Ayahuasca Vine	rgb(110, 81, 0)	hsl(44, 100%, 22%)
Everglade	rgb(44, 63, 39)	hsl(108, 24%, 20%)
Elite Teal	rgb(0, 52, 51)	hsl(179, 100%, 10%)
Balsamico	rgb(19, 12, 0)	hsl(38, 100%, 4%)

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

/* Ayahuasca Vine to Balsamico — https://swatchly.xyz/palette/6e5100-2c3f27-003433-130c00 */
:root {
  --ayahuasca-vine: #6e5100;
  --everglade: #2c3f27;
  --elite-teal: #003433;
  --balsamico: #130c00;
}

Tailwind CSS v4

/* Ayahuasca Vine to Balsamico — https://swatchly.xyz/palette/6e5100-2c3f27-003433-130c00 */
@theme {
  --color-ayahuasca-vine: #6e5100;
  --color-ayahuasca-vine-50: #fff4de;
  --color-ayahuasca-vine-100: #fde9c0;
  --color-ayahuasca-vine-200: #edd5a4;
  --color-ayahuasca-vine-300: #d9be86;
  --color-ayahuasca-vine-400: #bc9e5f;
  --color-ayahuasca-vine-500: #a18240;
  --color-ayahuasca-vine-600: #856825;
  --color-ayahuasca-vine-700: #6e5100;
  --color-ayahuasca-vine-800: #563f00;
  --color-ayahuasca-vine-900: #433000;
  --color-ayahuasca-vine-950: #2b1d00;
  --color-everglade: #2c3f27;
  --color-everglade-50: #edfae9;
  --color-everglade-100: #e2f0de;
  --color-everglade-200: #ccdec8;
  --color-everglade-300: #b4c8af;
  --color-everglade-400: #95aa8f;
  --color-everglade-500: #7a9075;
  --color-everglade-600: #61765c;
  --color-everglade-700: #4d6048;
  --color-everglade-800: #3c4d38;
  --color-everglade-900: #2c3f27;
  --color-everglade-950: #1d281a;
  --color-elite-teal: #003433;
  --color-elite-teal-50: #e1fbfa;
  --color-elite-teal-100: #d4f2f1;
  --color-elite-teal-200: #bce0de;
  --color-elite-teal-300: #a2cac8;
  --color-elite-teal-400: #7daaa8;
  --color-elite-teal-500: #5f8e8c;
  --color-elite-teal-600: #457170;
  --color-elite-teal-700: #305957;
  --color-elite-teal-800: #214342;
  --color-elite-teal-900: #003433;
  --color-elite-teal-950: #0a1e1d;
  --color-balsamico: #130c00;
  --color-balsamico-50: #faf5e8;
  --color-balsamico-100: #f1ebdc;
  --color-balsamico-200: #ded7c6;
  --color-balsamico-300: #c8c0ad;
  --color-balsamico-400: #aaa18c;
  --color-balsamico-500: #8a816c;
  --color-balsamico-600: #6c6350;
  --color-balsamico-700: #514a39;
  --color-balsamico-800: #3a3426;
  --color-balsamico-900: #262217;
  --color-balsamico-950: #130c00;
}