Start generating

Total Eclipse to Whisky Barrel color palette

2E3446Total Eclipse395D61Arctic NightsA18E7DEarthboundDBE0EEDelicate Cloud86BDBERiverbed937458Whisky Barrel
Open in generator Export PNG, PDF, ASE…

About this palette

Total Eclipse to Whisky Barrel is a 6-color muted palette: #2E3446 (Total Eclipse), #395D61 (Arctic Nights), #A18E7D (Earthbound), #DBE0EE (Delicate Cloud), #86BDBE (Riverbed), #937458 (Whisky Barrel). It mixes gray, turquoise, orange tones and feels cool overall. The strongest text pairing is #2E3446 on #DBE0EE with a contrast ratio of 9.38:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Total Eclipsergb(46, 52, 70)hsl(225, 21%, 23%)
Arctic Nightsrgb(57, 93, 97)hsl(186, 26%, 30%)
Earthboundrgb(161, 142, 125)hsl(28, 16%, 56%)
Delicate Cloudrgb(219, 224, 238)hsl(224, 36%, 90%)
Riverbedrgb(134, 189, 190)hsl(181, 30%, 64%)
Whisky Barrelrgb(147, 116, 88)hsl(28, 25%, 46%)

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.

  • Aa9.38:1 Very good#2E3446 on #DBE0EE
  • Aa9.38:1 Very good#DBE0EE on #2E3446
  • Aa5.92:1 Good#2E3446 on #86BDBE
  • Aa5.92:1 Good#86BDBE on #2E3446
  • Aa5.46:1 Good#395D61 on #DBE0EE
  • Aa5.46:1 Good#DBE0EE on #395D61
  • Aa3.94:1 Poor#2E3446 on #A18E7D
  • Aa3.94:1 Poor#A18E7D on #2E3446

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Total Eclipse to Whisky Barrel — https://swatchly.xyz/palette/2e3446-395d61-a18e7d-dbe0ee-86bdbe-937458 */
:root {
  --total-eclipse: #2e3446;
  --arctic-nights: #395d61;
  --earthbound: #a18e7d;
  --delicate-cloud: #dbe0ee;
  --riverbed: #86bdbe;
  --whisky-barrel: #937458;
}

Tailwind CSS v4

/* Total Eclipse to Whisky Barrel — https://swatchly.xyz/palette/2e3446-395d61-a18e7d-dbe0ee-86bdbe-937458 */
@theme {
  --color-total-eclipse: #2e3446;
  --color-total-eclipse-50: #f1f5ff;
  --color-total-eclipse-100: #e6ebf9;
  --color-total-eclipse-200: #d1d7e8;
  --color-total-eclipse-300: #bac0d4;
  --color-total-eclipse-400: #9aa1b6;
  --color-total-eclipse-500: #7f869b;
  --color-total-eclipse-600: #656c80;
  --color-total-eclipse-700: #505668;
  --color-total-eclipse-800: #3e4353;
  --color-total-eclipse-900: #2e3446;
  --color-total-eclipse-950: #1d202a;
  --color-arctic-nights: #395d61;
  --color-arctic-nights-50: #e4fafc;
  --color-arctic-nights-100: #d8f1f3;
  --color-arctic-nights-200: #c1dee1;
  --color-arctic-nights-300: #a7c8cc;
  --color-arctic-nights-400: #85aaae;
  --color-arctic-nights-500: #698e93;
  --color-arctic-nights-600: #507478;
  --color-arctic-nights-700: #395d61;
  --color-arctic-nights-800: #2b494c;
  --color-arctic-nights-900: #1f383b;
  --color-arctic-nights-950: #112325;
  --color-earthbound: #a18e7d;
  --color-earthbound-50: #fff5ed;
  --color-earthbound-100: #f9ede2;
  --color-earthbound-200: #e9dbce;
  --color-earthbound-300: #d6c6b7;
  --color-earthbound-400: #baa898;
  --color-earthbound-500: #a18e7d;
  --color-earthbound-600: #847161;
  --color-earthbound-700: #6a594a;
  --color-earthbound-800: #534437;
  --color-earthbound-900: #403428;
  --color-earthbound-950: #281f17;
  --color-delicate-cloud: #dbe0ee;
  --color-delicate-cloud-50: #fafbff;
  --color-delicate-cloud-100: #f0f2fa;
  --color-delicate-cloud-200: #dbe0ee;
  --color-delicate-cloud-300: #c4c8d3;
  --color-delicate-cloud-400: #a2a7b3;
  --color-delicate-cloud-500: #858a97;
  --color-delicate-cloud-600: #6a6e7a;
  --color-delicate-cloud-700: #525661;
  --color-delicate-cloud-800: #3f424c;
  --color-delicate-cloud-900: #30333b;
  --color-delicate-cloud-950: #1d1f25;
  --color-riverbed: #86bdbe;
  --color-riverbed-50: #d3f5f5;
  --color-riverbed-100: #c3e9e9;
  --color-riverbed-200: #a8d4d5;
  --color-riverbed-300: #86bdbe;
  --color-riverbed-400: #6ba0a1;
  --color-riverbed-500: #518788;
  --color-riverbed-600: #3b6f70;
  --color-riverbed-700: #2a5a5b;
  --color-riverbed-800: #1d4849;
  --color-riverbed-900: #14393a;
  --color-riverbed-950: #092425;
  --color-whisky-barrel: #937458;
  --color-whisky-barrel-50: #fff0e3;
  --color-whisky-barrel-100: #f9e2cf;
  --color-whisky-barrel-200: #e6ccb5;
  --color-whisky-barrel-300: #d0b398;
  --color-whisky-barrel-400: #b19175;
  --color-whisky-barrel-500: #937458;
  --color-whisky-barrel-600: #795c42;
  --color-whisky-barrel-700: #624831;
  --color-whisky-barrel-800: #4e3823;
  --color-whisky-barrel-900: #3e2b19;
  --color-whisky-barrel-950: #281a0e;
}

Similar palettes