Blushing Coconut to Night Demons Color Palette

About this palette

Blushing Coconut to Night Demons is a 4-color muted, gradient palette: #EED3CA (Blushing Coconut), #9C856D (Tahini Brown), #684A54 (Wine Stain), #221B1E (Night Demons). It mixes gray, orange, red tones and feels warm overall. The strongest text pairing is #EED3CA on #221B1E with a contrast ratio of 11.91:1, and 3 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Blushing Coconut	rgb(238, 211, 202)	hsl(15, 51%, 86%)
Tahini Brown	rgb(156, 133, 109)	hsl(31, 19%, 52%)
Wine Stain	rgb(104, 74, 84)	hsl(340, 17%, 35%)
Night Demons	rgb(34, 27, 30)	hsl(334, 11%, 12%)

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.91:1 Very good#EED3CA on #221B1E
Aa11.91:1 Very good#221B1E on #EED3CA
Aa5.49:1 Good#EED3CA on #684A54
Aa5.49:1 Good#684A54 on #EED3CA
Aa4.82:1 Good#9C856D on #221B1E
Aa4.82:1 Good#221B1E on #9C856D

Color blindness preview

CSS variables

/* Blushing Coconut to Night Demons — https://swatchly.xyz/palette/eed3ca-9c856d-684a54-221b1e */
:root {
  --blushing-coconut: #eed3ca;
  --tahini-brown: #9c856d;
  --wine-stain: #684a54;
  --night-demons: #221b1e;
}

Tailwind CSS v4

/* Blushing Coconut to Night Demons — https://swatchly.xyz/palette/eed3ca-9c856d-684a54-221b1e */
@theme {
  --color-blushing-coconut: #eed3ca;
  --color-blushing-coconut-50: #fff4f0;
  --color-blushing-coconut-100: #fae9e3;
  --color-blushing-coconut-200: #eed3ca;
  --color-blushing-coconut-300: #d4bdb6;
  --color-blushing-coconut-400: #b59d95;
  --color-blushing-coconut-500: #998179;
  --color-blushing-coconut-600: #7e665f;
  --color-blushing-coconut-700: #655049;
  --color-blushing-coconut-800: #503e38;
  --color-blushing-coconut-900: #3e2f2a;
  --color-blushing-coconut-950: #271c19;
  --color-tahini-brown: #9c856d;
  --color-tahini-brown-50: #fff4e8;
  --color-tahini-brown-100: #f9eada;
  --color-tahini-brown-200: #e8d6c3;
  --color-tahini-brown-300: #d4bfaa;
  --color-tahini-brown-400: #b7a089;
  --color-tahini-brown-500: #9c856d;
  --color-tahini-brown-600: #806a53;
  --color-tahini-brown-700: #67533e;
  --color-tahini-brown-800: #51402e;
  --color-tahini-brown-900: #3f3121;
  --color-tahini-brown-950: #281d12;
  --color-wine-stain: #684a54;
  --color-wine-stain-50: #fff1f5;
  --color-wine-stain-100: #fbe4eb;
  --color-wine-stain-200: #eacfd7;
  --color-wine-stain-300: #d5b7c0;
  --color-wine-stain-400: #b796a1;
  --color-wine-stain-500: #9c7b85;
  --color-wine-stain-600: #7f616b;
  --color-wine-stain-700: #684a54;
  --color-wine-stain-800: #513941;
  --color-wine-stain-900: #402b32;
  --color-wine-stain-950: #281a1f;
  --color-night-demons: #221b1e;
  --color-night-demons-50: #f9f3f6;
  --color-night-demons-100: #efe9ec;
  --color-night-demons-200: #dcd5d8;
  --color-night-demons-300: #c7bec2;
  --color-night-demons-400: #a89fa2;
  --color-night-demons-500: #8c8387;
  --color-night-demons-600: #71686c;
  --color-night-demons-700: #595255;
  --color-night-demons-800: #453f42;
  --color-night-demons-900: #352f32;
  --color-night-demons-950: #221b1e;
}