Snowy Summit to Underworld color palette

C8D6EASnowy Summit B2B7CCEthereal Mist AC8DA6Voila!566049Tree of Life 473544Voodoo 24251DUnderworld

Open in generator Export PNG, PDF, ASE…

About this palette

Snowy Summit to Underworld is a 6-color muted palette: #C8D6EA (Snowy Summit), #B2B7CC (Ethereal Mist), #AC8DA6 (Voila!), #566049 (Tree of Life), #473544 (Voodoo), #24251D (Underworld). It mixes gray, pink, green, purple tones and feels warm overall. The strongest text pairing is #C8D6EA on #24251D with a contrast ratio of 10.51:1, and 6 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Snowy Summit	rgb(200, 214, 234)	hsl(215, 45%, 85%)
Ethereal Mist	rgb(178, 183, 204)	hsl(228, 20%, 75%)
Voila!	rgb(172, 141, 166)	hsl(312, 16%, 61%)
Tree of Life	rgb(86, 96, 73)	hsl(86, 14%, 33%)
Voodoo	rgb(71, 53, 68)	hsl(310, 15%, 24%)
Underworld	rgb(36, 37, 29)	hsl(68, 12%, 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.51:1 Very good#C8D6EA on #24251D
Aa10.51:1 Very good#24251D on #C8D6EA
Aa7.76:1 Very good#B2B7CC on #24251D
Aa7.76:1 Very good#24251D on #B2B7CC
Aa7.67:1 Very good#C8D6EA on #473544
Aa7.67:1 Very good#473544 on #C8D6EA
Aa5.66:1 Good#B2B7CC on #473544
Aa5.66:1 Good#473544 on #B2B7CC

Color blindness preview

CSS variables

/* Snowy Summit to Underworld — https://swatchly.xyz/palette/c8d6ea-b2b7cc-ac8da6-566049-473544-24251d */
:root {
  --snowy-summit: #c8d6ea;
  --ethereal-mist: #b2b7cc;
  --voila: #ac8da6;
  --tree-of-life: #566049;
  --voodoo: #473544;
  --underworld: #24251d;
}

Tailwind CSS v4

/* Snowy Summit to Underworld — https://swatchly.xyz/palette/c8d6ea-b2b7cc-ac8da6-566049-473544-24251d */
@theme {
  --color-snowy-summit: #c8d6ea;
  --color-snowy-summit-50: #ecf4ff;
  --color-snowy-summit-100: #e1eaf7;
  --color-snowy-summit-200: #c8d6ea;
  --color-snowy-summit-300: #b4c0d1;
  --color-snowy-summit-400: #94a1b3;
  --color-snowy-summit-500: #798698;
  --color-snowy-summit-600: #606c7d;
  --color-snowy-summit-700: #4b5665;
  --color-snowy-summit-800: #3a4351;
  --color-snowy-summit-900: #2b333f;
  --color-snowy-summit-950: #1a2028;
  --color-ethereal-mist: #b2b7cc;
  --color-ethereal-mist-50: #edf0fd;
  --color-ethereal-mist-100: #e1e4f3;
  --color-ethereal-mist-200: #cbcfe0;
  --color-ethereal-mist-300: #b2b7cc;
  --color-ethereal-mist-400: #9599ad;
  --color-ethereal-mist-500: #7b8093;
  --color-ethereal-mist-600: #636779;
  --color-ethereal-mist-700: #4e5262;
  --color-ethereal-mist-800: #3d404f;
  --color-ethereal-mist-900: #2f323f;
  --color-ethereal-mist-950: #1d1f28;
  --color-voila: #ac8da6;
  --color-voila-50: #feebfa;
  --color-voila-100: #f4def0;
  --color-voila-200: #e2c8dc;
  --color-voila-300: #cbafc6;
  --color-voila-400: #ac8da6;
  --color-voila-500: #92748c;
  --color-voila-600: #785c72;
  --color-voila-700: #61485c;
  --color-voila-800: #4d3749;
  --color-voila-900: #3d2b3a;
  --color-voila-950: #281a25;
  --color-tree-of-life: #566049;
  --color-tree-of-life-50: #f1f8e9;
  --color-tree-of-life-100: #e7eede;
  --color-tree-of-life-200: #d4dcc9;
  --color-tree-of-life-300: #bec8b2;
  --color-tree-of-life-400: #9faa92;
  --color-tree-of-life-500: #858f77;
  --color-tree-of-life-600: #6b765e;
  --color-tree-of-life-700: #566049;
  --color-tree-of-life-800: #434b38;
  --color-tree-of-life-900: #333a29;
  --color-tree-of-life-950: #1f2418;
  --color-voodoo: #473544;
  --color-voodoo-50: #fdf1fb;
  --color-voodoo-100: #f5e6f2;
  --color-voodoo-200: #e2d1df;
  --color-voodoo-300: #ccb9c8;
  --color-voodoo-400: #ac97a8;
  --color-voodoo-500: #907b8c;
  --color-voodoo-600: #736070;
  --color-voodoo-700: #5a4957;
  --color-voodoo-800: #473544;
  --color-voodoo-900: #352933;
  --color-voodoo-950: #21181f;
  --color-underworld: #24251d;
  --color-underworld-50: #f5f6f0;
  --color-underworld-100: #ebece5;
  --color-underworld-200: #d7d8d0;
  --color-underworld-300: #c1c2b9;
  --color-underworld-400: #a1a399;
  --color-underworld-500: #87887e;
  --color-underworld-600: #6d6f65;
  --color-underworld-700: #585950;
  --color-underworld-800: #46473f;
  --color-underworld-900: #373831;
  --color-underworld-950: #24251d;
}