Pinot Noir to Bangalore color palette

685052Pinot Noir 30271DWood Bark A07572Equestrienne F0E0D6Delicate Bliss BDA698Martini B8A98CBangalore

Open in generator Export PNG, PDF, ASE…

About this palette

Pinot Noir to Bangalore is a 6-color muted palette: #685052 (Pinot Noir), #30271D (Wood Bark), #A07572 (Equestrienne), #F0E0D6 (Delicate Bliss), #BDA698 (Martini), #B8A98C (Bangalore). It mixes gray, red, yellow tones and feels warm overall. The strongest text pairing is #30271D on #F0E0D6 with a contrast ratio of 11.40:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pinot Noir	rgb(104, 80, 82)	hsl(355, 13%, 36%)
Wood Bark	rgb(48, 39, 29)	hsl(32, 25%, 15%)
Equestrienne	rgb(160, 117, 114)	hsl(4, 19%, 54%)
Delicate Bliss	rgb(240, 224, 214)	hsl(23, 46%, 89%)
Martini	rgb(189, 166, 152)	hsl(23, 22%, 67%)
Bangalore	rgb(184, 169, 140)	hsl(40, 24%, 64%)

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.

Aa11.40:1 Very good#30271D on #F0E0D6
Aa11.40:1 Very good#F0E0D6 on #30271D
Aa6.34:1 Good#30271D on #B8A98C
Aa6.34:1 Good#B8A98C on #30271D
Aa6.33:1 Good#30271D on #BDA698
Aa6.33:1 Good#BDA698 on #30271D
Aa5.72:1 Good#685052 on #F0E0D6
Aa5.72:1 Good#F0E0D6 on #685052

Color blindness preview

CSS variables

/* Pinot Noir to Bangalore — https://swatchly.xyz/palette/685052-30271d-a07572-f0e0d6-bda698-b8a98c */
:root {
  --pinot-noir: #685052;
  --wood-bark: #30271d;
  --equestrienne: #a07572;
  --delicate-bliss: #f0e0d6;
  --martini: #bda698;
  --bangalore: #b8a98c;
}

Tailwind CSS v4

/* Pinot Noir to Bangalore — https://swatchly.xyz/palette/685052-30271d-a07572-f0e0d6-bda698-b8a98c */
@theme {
  --color-pinot-noir: #685052;
  --color-pinot-noir-50: #fff1f2;
  --color-pinot-noir-100: #f8e6e7;
  --color-pinot-noir-200: #e7d2d3;
  --color-pinot-noir-300: #d3bbbd;
  --color-pinot-noir-400: #b59b9d;
  --color-pinot-noir-500: #9a8082;
  --color-pinot-noir-600: #7f6668;
  --color-pinot-noir-700: #685052;
  --color-pinot-noir-800: #523e40;
  --color-pinot-noir-900: #402f30;
  --color-pinot-noir-950: #281c1d;
  --color-wood-bark: #30271d;
  --color-wood-bark-50: #fbf4ed;
  --color-wood-bark-100: #f1eae2;
  --color-wood-bark-200: #dfd6cc;
  --color-wood-bark-300: #c9bfb4;
  --color-wood-bark-400: #aa9f94;
  --color-wood-bark-500: #91867a;
  --color-wood-bark-600: #786e62;
  --color-wood-bark-700: #63594e;
  --color-wood-bark-800: #50483e;
  --color-wood-bark-900: #413a32;
  --color-wood-bark-950: #30271d;
  --color-equestrienne: #a07572;
  --color-equestrienne-50: #fff0ef;
  --color-equestrienne-100: #ffe2df;
  --color-equestrienne-200: #efcbc8;
  --color-equestrienne-300: #dbb2af;
  --color-equestrienne-400: #bd918e;
  --color-equestrienne-500: #a07572;
  --color-equestrienne-600: #845c59;
  --color-equestrienne-700: #6c4845;
  --color-equestrienne-800: #563735;
  --color-equestrienne-900: #442928;
  --color-equestrienne-950: #2c1918;
  --color-delicate-bliss: #f0e0d6;
  --color-delicate-bliss-50: #f6ede7;
  --color-delicate-bliss-100: #f0e0d6;
  --color-delicate-bliss-200: #dbcec7;
  --color-delicate-bliss-300: #c6b9b1;
  --color-delicate-bliss-400: #a99b92;
  --color-delicate-bliss-500: #8f8178;
  --color-delicate-bliss-600: #75685f;
  --color-delicate-bliss-700: #5f524b;
  --color-delicate-bliss-800: #4b4039;
  --color-delicate-bliss-900: #3a312b;
  --color-delicate-bliss-950: #241e1a;
  --color-martini: #bda698;
  --color-martini-50: #fff7f2;
  --color-martini-100: #fcede5;
  --color-martini-200: #ecdbd0;
  --color-martini-300: #d8c5b9;
  --color-martini-400: #bda698;
  --color-martini-500: #9f897b;
  --color-martini-600: #826d60;
  --color-martini-700: #685549;
  --color-martini-800: #524137;
  --color-martini-900: #3f3128;
  --color-martini-950: #271d17;
  --color-bangalore: #b8a98c;
  --color-bangalore-50: #fff8e9;
  --color-bangalore-100: #f8efdd;
  --color-bangalore-200: #e8ddc8;
  --color-bangalore-300: #d4c7af;
  --color-bangalore-400: #b8a98c;
  --color-bangalore-500: #9a8c70;
  --color-bangalore-600: #7e7055;
  --color-bangalore-700: #64583f;
  --color-bangalore-800: #4f432e;
  --color-bangalore-900: #3c3320;
  --color-bangalore-950: #251e11;
}