Havana to Wine Stain Color Palette

About this palette

Havana to Wine Stain is a 5-color muted, warm, vintage palette: #3D2A2F (Havana), #865B54 (Wild West), #F3C5B9 (Strawberry Risotto), #BD8E6D (Butterum), #67434E (Wine Stain). It mixes gray, red, pink, orange tones and feels warm overall. The strongest text pairing is #3D2A2F on #F3C5B9 with a contrast ratio of 8.59:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Havana	rgb(61, 42, 47)	hsl(344, 18%, 20%)
Wild West	rgb(134, 91, 84)	hsl(8, 23%, 43%)
Strawberry Risotto	rgb(243, 197, 185)	hsl(12, 71%, 84%)
Butterum	rgb(189, 142, 109)	hsl(25, 38%, 58%)
Wine Stain	rgb(103, 67, 78)	hsl(342, 21%, 33%)

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.

Aa8.59:1 Very good#3D2A2F on #F3C5B9
Aa8.59:1 Very good#F3C5B9 on #3D2A2F
Aa5.42:1 Good#F3C5B9 on #67434E
Aa5.42:1 Good#67434E on #F3C5B9
Aa4.62:1 Good#3D2A2F on #BD8E6D
Aa4.62:1 Good#BD8E6D on #3D2A2F
Aa3.71:1 Poor#865B54 on #F3C5B9
Aa3.71:1 Poor#F3C5B9 on #865B54

Color blindness preview

CSS variables

/* Havana to Wine Stain — https://swatchly.xyz/palette/3d2a2f-865b54-f3c5b9-bd8e6d-67434e */
:root {
  --havana: #3d2a2f;
  --wild-west: #865b54;
  --strawberry-risotto: #f3c5b9;
  --butterum: #bd8e6d;
  --wine-stain: #67434e;
}

Tailwind CSS v4

/* Havana to Wine Stain — https://swatchly.xyz/palette/3d2a2f-865b54-f3c5b9-bd8e6d-67434e */
@theme {
  --color-havana: #3d2a2f;
  --color-havana-50: #fff1f4;
  --color-havana-100: #f6e6ea;
  --color-havana-200: #e5d2d6;
  --color-havana-300: #d0bbc0;
  --color-havana-400: #b19aa0;
  --color-havana-500: #957e84;
  --color-havana-600: #796469;
  --color-havana-700: #614d52;
  --color-havana-800: #4b3b3f;
  --color-havana-900: #3d2a2f;
  --color-havana-950: #241a1d;
  --color-wild-west: #865b54;
  --color-wild-west-50: #fff2ef;
  --color-wild-west-100: #ffe3de;
  --color-wild-west-200: #f2ccc5;
  --color-wild-west-300: #ddb3ac;
  --color-wild-west-400: #bf928a;
  --color-wild-west-500: #a3766e;
  --color-wild-west-600: #865b54;
  --color-wild-west-700: #6c4741;
  --color-wild-west-800: #573631;
  --color-wild-west-900: #442924;
  --color-wild-west-950: #2c1815;
  --color-strawberry-risotto: #f3c5b9;
  --color-strawberry-risotto-50: #ffece7;
  --color-strawberry-risotto-100: #fdded6;
  --color-strawberry-risotto-200: #f3c5b9;
  --color-strawberry-risotto-300: #d9b1a7;
  --color-strawberry-risotto-400: #bc9287;
  --color-strawberry-risotto-500: #a2786d;
  --color-strawberry-risotto-600: #865f55;
  --color-strawberry-risotto-700: #6e4a41;
  --color-strawberry-risotto-800: #583931;
  --color-strawberry-risotto-900: #452b24;
  --color-strawberry-risotto-950: #2c1a15;
  --color-butterum: #bd8e6d;
  --color-butterum-50: #ffefe4;
  --color-butterum-100: #ffe0cb;
  --color-butterum-200: #f0c9af;
  --color-butterum-300: #dbb092;
  --color-butterum-400: #bd8e6d;
  --color-butterum-500: #a27454;
  --color-butterum-600: #865c3d;
  --color-butterum-700: #6e482c;
  --color-butterum-800: #58371e;
  --color-butterum-900: #462a15;
  --color-butterum-950: #2e1a0a;
  --color-wine-stain: #67434e;
  --color-wine-stain-50: #fff1f5;
  --color-wine-stain-100: #ffe3ea;
  --color-wine-stain-200: #edccd5;
  --color-wine-stain-300: #d8b3bd;
  --color-wine-stain-400: #b9919d;
  --color-wine-stain-500: #9d7580;
  --color-wine-stain-600: #7f5a65;
  --color-wine-stain-700: #67434e;
  --color-wine-stain-800: #50343d;
  --color-wine-stain-900: #3f272e;
  --color-wine-stain-950: #28171c;
}