Bronze to Ayahuasca Vine color palette

About this palette

Bronze to Ayahuasca Vine is a 5-color warm, earthy, vintage palette: #9E7C00 (Bronze), #8C9EE8 (Cold Lips), #B1CDFF (Night Snow), #291F00 (Burnt Coffee), #5F4F00 (Ayahuasca Vine). It mixes yellow, blue, brown tones and feels warm overall. The strongest text pairing is #B1CDFF on #291F00 with a contrast ratio of 10.11:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Bronzergb(158, 124, 0)hsl(47, 100%, 31%)
Cold Lipsrgb(140, 158, 232)hsl(228, 67%, 73%)
Night Snowrgb(177, 205, 255)hsl(218, 100%, 85%)
Burnt Coffeergb(41, 31, 0)hsl(45, 100%, 8%)
Ayahuasca Vinergb(95, 79, 0)hsl(50, 100%, 19%)

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.11:1 Very good#B1CDFF on #291F00
  • Aa10.11:1 Very good#291F00 on #B1CDFF
  • Aa6.33:1 Good#8C9EE8 on #291F00
  • Aa6.33:1 Good#291F00 on #8C9EE8
  • Aa5.01:1 Good#B1CDFF on #5F4F00
  • Aa5.01:1 Good#5F4F00 on #B1CDFF
  • Aa4.14:1 Poor#9E7C00 on #291F00
  • Aa4.14:1 Poor#291F00 on #9E7C00

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Bronze to Ayahuasca Vine — https://swatchly.xyz/palette/9e7c00-8c9ee8-b1cdff-291f00-5f4f00 */
:root {
  --bronze: #9e7c00;
  --cold-lips: #8c9ee8;
  --night-snow: #b1cdff;
  --burnt-coffee: #291f00;
  --ayahuasca-vine: #5f4f00;
}

Tailwind CSS v4

/* Bronze to Ayahuasca Vine — https://swatchly.xyz/palette/9e7c00-8c9ee8-b1cdff-291f00-5f4f00 */
@theme {
  --color-bronze: #9e7c00;
  --color-bronze-50: #fff3d6;
  --color-bronze-100: #fee8ae;
  --color-bronze-200: #edd28c;
  --color-bronze-300: #d8ba68;
  --color-bronze-400: #ba9938;
  --color-bronze-500: #9e7c00;
  --color-bronze-600: #806400;
  --color-bronze-700: #664f00;
  --color-bronze-800: #503d00;
  --color-bronze-900: #3e2f00;
  --color-bronze-950: #281d00;
  --color-cold-lips: #8c9ee8;
  --color-cold-lips-50: #f2f5ff;
  --color-cold-lips-100: #e5ebff;
  --color-cold-lips-200: #ccd7ff;
  --color-cold-lips-300: #aebfff;
  --color-cold-lips-400: #8c9ee8;
  --color-cold-lips-500: #7182ca;
  --color-cold-lips-600: #5867ab;
  --color-cold-lips-700: #44508e;
  --color-cold-lips-800: #333e74;
  --color-cold-lips-900: #262e5c;
  --color-cold-lips-950: #161c3d;
  --color-night-snow: #b1cdff;
  --color-night-snow-50: #f9fbff;
  --color-night-snow-100: #edf3ff;
  --color-night-snow-200: #d1e2ff;
  --color-night-snow-300: #b1cdff;
  --color-night-snow-400: #92abd8;
  --color-night-snow-500: #748ebc;
  --color-night-snow-600: #58719d;
  --color-night-snow-700: #425881;
  --color-night-snow-800: #304467;
  --color-night-snow-900: #233250;
  --color-night-snow-950: #141f34;
  --color-burnt-coffee: #291f00;
  --color-burnt-coffee-50: #fcf5e1;
  --color-burnt-coffee-100: #f3ebd4;
  --color-burnt-coffee-200: #e0d7bd;
  --color-burnt-coffee-300: #cbc1a2;
  --color-burnt-coffee-400: #aca180;
  --color-burnt-coffee-500: #918664;
  --color-burnt-coffee-600: #776c4b;
  --color-burnt-coffee-700: #5f5538;
  --color-burnt-coffee-800: #4b4228;
  --color-burnt-coffee-900: #3b331d;
  --color-burnt-coffee-950: #291f00;
  --color-ayahuasca-vine: #5f4f00;
  --color-ayahuasca-vine-50: #fff6d1;
  --color-ayahuasca-vine-100: #f6ecc2;
  --color-ayahuasca-vine-200: #e3d7a5;
  --color-ayahuasca-vine-300: #cebf86;
  --color-ayahuasca-vine-400: #af9e5f;
  --color-ayahuasca-vine-500: #938240;
  --color-ayahuasca-vine-600: #766725;
  --color-ayahuasca-vine-700: #5f4f00;
  --color-ayahuasca-vine-800: #4a3d04;
  --color-ayahuasca-vine-900: #392f00;
  --color-ayahuasca-vine-950: #241d00;
}

Similar palettes