Couch to Smell the Mint Color Palette

About this palette

Couch to Smell the Mint is a 5-color cool, earthy palette: #4C2B18 (Couch), #387D46 (Bold Irish), #A475A2 (Drama Queen), #8CD3FF (Clear Sky), #C0F6C4 (Smell the Mint). It mixes brown, green, pink, blue tones and feels cool overall. The strongest text pairing is #4C2B18 on #C0F6C4 with a contrast ratio of 10.34:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Couch	rgb(76, 43, 24)	hsl(22, 52%, 20%)
Bold Irish	rgb(56, 125, 70)	hsl(132, 38%, 35%)
Drama Queen	rgb(164, 117, 162)	hsl(303, 21%, 55%)
Clear Sky	rgb(140, 211, 255)	hsl(203, 100%, 77%)
Smell the Mint	rgb(192, 246, 196)	hsl(124, 75%, 86%)

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.34:1 Very good#4C2B18 on #C0F6C4
Aa10.34:1 Very good#C0F6C4 on #4C2B18
Aa7.73:1 Very good#4C2B18 on #8CD3FF
Aa7.73:1 Very good#8CD3FF on #4C2B18
Aa4.11:1 Poor#387D46 on #C0F6C4
Aa4.11:1 Poor#C0F6C4 on #387D46
Aa3.39:1 Poor#4C2B18 on #A475A2
Aa3.39:1 Poor#A475A2 on #4C2B18

Color blindness preview

CSS variables

/* Couch to Smell the Mint — https://swatchly.xyz/palette/4c2b18-387d46-a475a2-8cd3ff-c0f6c4 */
:root {
  --couch: #4c2b18;
  --bold-irish: #387d46;
  --drama-queen: #a475a2;
  --clear-sky: #8cd3ff;
  --smell-the-mint: #c0f6c4;
}

Tailwind CSS v4

/* Couch to Smell the Mint — https://swatchly.xyz/palette/4c2b18-387d46-a475a2-8cd3ff-c0f6c4 */
@theme {
  --color-couch: #4c2b18;
  --color-couch-50: #fff2ec;
  --color-couch-100: #ffe5d8;
  --color-couch-200: #f0d0bf;
  --color-couch-300: #dcb8a5;
  --color-couch-400: #bf9883;
  --color-couch-500: #a47d68;
  --color-couch-600: #88634f;
  --color-couch-700: #6f4e3b;
  --color-couch-800: #593c2c;
  --color-couch-900: #4c2b18;
  --color-couch-950: #2e1c12;
  --color-bold-irish: #387d46;
  --color-bold-irish-50: #e0ffe3;
  --color-bold-irish-100: #cdf9d2;
  --color-bold-irish-200: #b3e7ba;
  --color-bold-irish-300: #97d29f;
  --color-bold-irish-400: #72b47c;
  --color-bold-irish-500: #549860;
  --color-bold-irish-600: #387d46;
  --color-bold-irish-700: #256433;
  --color-bold-irish-800: #164f24;
  --color-bold-irish-900: #0c3e19;
  --color-bold-irish-950: #04270d;
  --color-drama-queen: #a475a2;
  --color-drama-queen-50: #fff0fe;
  --color-drama-queen-100: #ffe1fd;
  --color-drama-queen-200: #f0caee;
  --color-drama-queen-300: #dcb2da;
  --color-drama-queen-400: #bf91bd;
  --color-drama-queen-500: #a475a2;
  --color-drama-queen-600: #885b86;
  --color-drama-queen-700: #6e466d;
  --color-drama-queen-800: #583456;
  --color-drama-queen-900: #452744;
  --color-drama-queen-950: #2c162b;
  --color-clear-sky: #8cd3ff;
  --color-clear-sky-50: #f4fbff;
  --color-clear-sky-100: #e3f4ff;
  --color-clear-sky-200: #bde5ff;
  --color-clear-sky-300: #8cd3ff;
  --color-clear-sky-400: #6fb1d9;
  --color-clear-sky-500: #4e94bd;
  --color-clear-sky-600: #31779f;
  --color-clear-sky-700: #195e82;
  --color-clear-sky-800: #074968;
  --color-clear-sky-900: #003752;
  --color-clear-sky-950: #002235;
  --color-smell-the-mint: #c0f6c4;
  --color-smell-the-mint-50: #dbfadd;
  --color-smell-the-mint-100: #c0f6c4;
  --color-smell-the-mint-200: #b7dfba;
  --color-smell-the-mint-300: #9ecba1;
  --color-smell-the-mint-400: #7cad80;
  --color-smell-the-mint-500: #619365;
  --color-smell-the-mint-600: #48784d;
  --color-smell-the-mint-700: #35613a;
  --color-smell-the-mint-800: #254d2a;
  --color-smell-the-mint-900: #1a3b1e;
  --color-smell-the-mint-950: #0d2510;
}