Wintermint to Burnt Coffee color palette

9ED6B4Wintermint 968EBEMagic Carpet 247B4DWoodland Soul 5A301DCount Chocula 2D1813Burnt Coffee

About this palette

Wintermint to Burnt Coffee is a 5-color cool, earthy, vintage palette: #9ED6B4 (Wintermint), #968EBE (Magic Carpet), #247B4D (Woodland Soul), #5A301D (Count Chocula), #2D1813 (Burnt Coffee). It mixes green, purple, brown tones and feels cool overall. The strongest text pairing is #9ED6B4 on #2D1813 with a contrast ratio of 10.17:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Wintermint	rgb(158, 214, 180)	hsl(144, 41%, 73%)
Magic Carpet	rgb(150, 142, 190)	hsl(250, 27%, 65%)
Woodland Soul	rgb(36, 123, 77)	hsl(148, 55%, 31%)
Count Chocula	rgb(90, 48, 29)	hsl(19, 51%, 23%)
Burnt Coffee	rgb(45, 24, 19)	hsl(12, 41%, 13%)

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.17:1 Very good#9ED6B4 on #2D1813
Aa10.17:1 Very good#2D1813 on #9ED6B4
Aa6.79:1 Good#9ED6B4 on #5A301D
Aa6.79:1 Good#5A301D on #9ED6B4
Aa5.52:1 Good#968EBE on #2D1813
Aa5.52:1 Good#2D1813 on #968EBE
Aa3.68:1 Poor#968EBE on #5A301D
Aa3.68:1 Poor#5A301D on #968EBE

Color blindness preview

CSS variables

/* Wintermint to Burnt Coffee — https://swatchly.xyz/palette/9ed6b4-968ebe-247b4d-5a301d-2d1813 */
:root {
  --wintermint: #9ed6b4;
  --magic-carpet: #968ebe;
  --woodland-soul: #247b4d;
  --count-chocula: #5a301d;
  --burnt-coffee: #2d1813;
}

Tailwind CSS v4

/* Wintermint to Burnt Coffee — https://swatchly.xyz/palette/9ed6b4-968ebe-247b4d-5a301d-2d1813 */
@theme {
  --color-wintermint: #9ed6b4;
  --color-wintermint-50: #e8fff0;
  --color-wintermint-100: #d8f9e4;
  --color-wintermint-200: #c0e8cf;
  --color-wintermint-300: #9ed6b4;
  --color-wintermint-400: #80b495;
  --color-wintermint-500: #629878;
  --color-wintermint-600: #477c5e;
  --color-wintermint-700: #326348;
  --color-wintermint-800: #224d36;
  --color-wintermint-900: #163b28;
  --color-wintermint-950: #0b2517;
  --color-magic-carpet: #968ebe;
  --color-magic-carpet-50: #f1eeff;
  --color-magic-carpet-100: #e5e0ff;
  --color-magic-carpet-200: #cfc9f1;
  --color-magic-carpet-300: #b7b0dc;
  --color-magic-carpet-400: #968ebe;
  --color-magic-carpet-500: #7d75a3;
  --color-magic-carpet-600: #655d89;
  --color-magic-carpet-700: #514970;
  --color-magic-carpet-800: #40395b;
  --color-magic-carpet-900: #322c49;
  --color-magic-carpet-950: #201b31;
  --color-woodland-soul: #247b4d;
  --color-woodland-soul-50: #deffe8;
  --color-woodland-soul-100: #c7f9d8;
  --color-woodland-soul-200: #abe7c0;
  --color-woodland-soul-300: #8cd2a6;
  --color-woodland-soul-400: #64b383;
  --color-woodland-soul-500: #449767;
  --color-woodland-soul-600: #247b4d;
  --color-woodland-soul-700: #10633a;
  --color-woodland-soul-800: #004e2b;
  --color-woodland-soul-900: #003d20;
  --color-woodland-soul-950: #002612;
  --color-count-chocula: #5a301d;
  --color-count-chocula-50: #fff2ed;
  --color-count-chocula-100: #ffe5da;
  --color-count-chocula-200: #f5cebd;
  --color-count-chocula-300: #e1b4a1;
  --color-count-chocula-400: #c3937e;
  --color-count-chocula-500: #a67661;
  --color-count-chocula-600: #885b48;
  --color-count-chocula-700: #6d4534;
  --color-count-chocula-800: #5a301d;
  --color-count-chocula-900: #43261a;
  --color-count-chocula-950: #2a160d;
  --color-burnt-coffee: #2d1813;
  --color-burnt-coffee-50: #fff2ef;
  --color-burnt-coffee-100: #f9e6e2;
  --color-burnt-coffee-200: #e8d2cc;
  --color-burnt-coffee-300: #d4bab4;
  --color-burnt-coffee-400: #b69a94;
  --color-burnt-coffee-500: #9a7f78;
  --color-burnt-coffee-600: #7e655e;
  --color-burnt-coffee-700: #664e49;
  --color-burnt-coffee-800: #503c37;
  --color-burnt-coffee-900: #3e2d29;
  --color-burnt-coffee-950: #2d1813;
}