Mink to Afternoon Coffee Color Palette

About this palette

Mink to Afternoon Coffee is a 5-color muted, warm, earthy, vintage palette: #8F7465 (Mink), #E1CDBE (Humble Blush), #53392C (Turtle), #BB9077 (Macaroon), #69554A (Afternoon Coffee). It mixes orange, gray, brown tones and feels warm overall. The strongest text pairing is #E1CDBE on #53392C with a contrast ratio of 6.88:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Mink	rgb(143, 116, 101)	hsl(21, 17%, 48%)
Humble Blush	rgb(225, 205, 190)	hsl(26, 37%, 81%)
Turtle	rgb(83, 57, 44)	hsl(20, 31%, 25%)
Macaroon	rgb(187, 144, 119)	hsl(22, 33%, 60%)
Afternoon Coffee	rgb(105, 85, 74)	hsl(21, 17%, 35%)

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.

Aa6.88:1 Good#E1CDBE on #53392C
Aa6.88:1 Good#53392C on #E1CDBE
Aa4.56:1 Good#E1CDBE on #69554A
Aa4.56:1 Good#69554A on #E1CDBE
Aa3.70:1 Poor#53392C on #BB9077
Aa3.70:1 Poor#BB9077 on #53392C

Color blindness preview

CSS variables

/* Mink to Afternoon Coffee — https://swatchly.xyz/palette/8f7465-e1cdbe-53392c-bb9077-69554a */
:root {
  --mink: #8f7465;
  --humble-blush: #e1cdbe;
  --turtle: #53392c;
  --macaroon: #bb9077;
  --afternoon-coffee: #69554a;
}

Tailwind CSS v4

/* Mink to Afternoon Coffee — https://swatchly.xyz/palette/8f7465-e1cdbe-53392c-bb9077-69554a */
@theme {
  --color-mink: #8f7465;
  --color-mink-50: #ffefe7;
  --color-mink-100: #f6e2d7;
  --color-mink-200: #e3ccbf;
  --color-mink-300: #cdb3a4;
  --color-mink-400: #ac9182;
  --color-mink-500: #8f7465;
  --color-mink-600: #755c4e;
  --color-mink-700: #5f493c;
  --color-mink-800: #4c382e;
  --color-mink-900: #3c2b22;
  --color-mink-950: #271b14;
  --color-humble-blush: #e1cdbe;
  --color-humble-blush-50: #faeee5;
  --color-humble-blush-100: #f0e3d9;
  --color-humble-blush-200: #e1cdbe;
  --color-humble-blush-300: #c9b8ab;
  --color-humble-blush-400: #ac9a8c;
  --color-humble-blush-500: #927f72;
  --color-humble-blush-600: #776659;
  --color-humble-blush-700: #605145;
  --color-humble-blush-800: #4d3f35;
  --color-humble-blush-900: #3c3027;
  --color-humble-blush-950: #261d17;
  --color-turtle: #53392c;
  --color-turtle-50: #fff2ec;
  --color-turtle-100: #fbe6dc;
  --color-turtle-200: #ead2c6;
  --color-turtle-300: #d5baac;
  --color-turtle-400: #b7998b;
  --color-turtle-500: #9b7d6f;
  --color-turtle-600: #7f6355;
  --color-turtle-700: #664d40;
  --color-turtle-800: #53392c;
  --color-turtle-900: #3e2c23;
  --color-turtle-950: #271a14;
  --color-macaroon: #bb9077;
  --color-macaroon-50: #ffefe6;
  --color-macaroon-100: #ffe1cf;
  --color-macaroon-200: #eecab6;
  --color-macaroon-300: #d9b29b;
  --color-macaroon-400: #bb9077;
  --color-macaroon-500: #a0765e;
  --color-macaroon-600: #845d46;
  --color-macaroon-700: #6c4934;
  --color-macaroon-800: #573826;
  --color-macaroon-900: #452b1b;
  --color-macaroon-950: #2d1a0f;
  --color-afternoon-coffee: #69554a;
  --color-afternoon-coffee-50: #fff2eb;
  --color-afternoon-coffee-100: #f7e8e0;
  --color-afternoon-coffee-200: #e6d4cb;
  --color-afternoon-coffee-300: #d2beb3;
  --color-afternoon-coffee-400: #b59f93;
  --color-afternoon-coffee-500: #9a8479;
  --color-afternoon-coffee-600: #7f6b60;
  --color-afternoon-coffee-700: #69554a;
  --color-afternoon-coffee-800: #524239;
  --color-afternoon-coffee-900: #40322b;
  --color-afternoon-coffee-950: #291f19;
}