Night Snow to Realm of the Underworld color palette

About this palette

Night Snow to Realm of the Underworld is a 5-color cool, earthy, vintage palette: #B8D0FF (Night Snow), #8F7A3E (Capers), #615100 (Ayahuasca Vine), #C190CA (Violaceous), #153E07 (Realm of the Underworld). It mixes blue, yellow, brown, purple, green tones and feels cool overall. The strongest text pairing is #B8D0FF on #153E07 with a contrast ratio of 7.83:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Night Snowrgb(184, 208, 255)hsl(220, 100%, 86%)
Capersrgb(143, 122, 62)hsl(44, 40%, 40%)
Ayahuasca Vinergb(97, 81, 0)hsl(50, 100%, 19%)
Violaceousrgb(193, 144, 202)hsl(291, 35%, 68%)
Realm of the Underworldrgb(21, 62, 7)hsl(105, 80%, 14%)

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.

  • Aa7.83:1 Very good#B8D0FF on #153E07
  • Aa7.83:1 Very good#153E07 on #B8D0FF
  • Aa5.03:1 Good#B8D0FF on #615100
  • Aa5.03:1 Good#615100 on #B8D0FF
  • Aa4.70:1 Good#C190CA on #153E07
  • Aa4.70:1 Good#153E07 on #C190CA
  • Aa3.02:1 Poor#615100 on #C190CA
  • Aa3.02:1 Poor#C190CA on #615100

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Night Snow to Realm of the Underworld — https://swatchly.xyz/palette/b8d0ff-8f7a3e-615100-c190ca-153e07 */
:root {
  --night-snow: #b8d0ff;
  --capers: #8f7a3e;
  --ayahuasca-vine: #615100;
  --violaceous: #c190ca;
  --realm-of-the-underworld: #153e07;
}

Tailwind CSS v4

/* Night Snow to Realm of the Underworld — https://swatchly.xyz/palette/b8d0ff-8f7a3e-615100-c190ca-153e07 */
@theme {
  --color-night-snow: #b8d0ff;
  --color-night-snow-50: #e8f0ff;
  --color-night-snow-100: #d8e5ff;
  --color-night-snow-200: #b8d0ff;
  --color-night-snow-300: #a6bbe3;
  --color-night-snow-400: #879dc8;
  --color-night-snow-500: #6d82ae;
  --color-night-snow-600: #556992;
  --color-night-snow-700: #415479;
  --color-night-snow-800: #324262;
  --color-night-snow-900: #25324e;
  --color-night-snow-950: #151f33;
  --color-capers: #8f7a3e;
  --color-capers-50: #fff3d1;
  --color-capers-100: #f5e7bf;
  --color-capers-200: #e2d1a2;
  --color-capers-300: #ccb883;
  --color-capers-400: #ac975c;
  --color-capers-500: #8f7a3e;
  --color-capers-600: #756227;
  --color-capers-700: #5f4d16;
  --color-capers-800: #4c3c0a;
  --color-capers-900: #3c2e03;
  --color-capers-950: #261d01;
  --color-ayahuasca-vine: #615100;
  --color-ayahuasca-vine-50: #fff6d0;
  --color-ayahuasca-vine-100: #f6ecc2;
  --color-ayahuasca-vine-200: #e4d7a5;
  --color-ayahuasca-vine-300: #cec086;
  --color-ayahuasca-vine-400: #b0a05f;
  --color-ayahuasca-vine-500: #948340;
  --color-ayahuasca-vine-600: #786825;
  --color-ayahuasca-vine-700: #615100;
  --color-ayahuasca-vine-800: #4c3f03;
  --color-ayahuasca-vine-900: #3b3000;
  --color-ayahuasca-vine-950: #251d00;
  --color-violaceous: #c190ca;
  --color-violaceous-50: #fdf2ff;
  --color-violaceous-100: #fbe4ff;
  --color-violaceous-200: #f0cbf7;
  --color-violaceous-300: #ddb2e4;
  --color-violaceous-400: #c190ca;
  --color-violaceous-500: #a474ad;
  --color-violaceous-600: #875a90;
  --color-violaceous-700: #6e4475;
  --color-violaceous-800: #57335e;
  --color-violaceous-900: #44254a;
  --color-violaceous-950: #2b152f;
  --color-realm-of-the-underworld: #153e07;
  --color-realm-of-the-underworld-50: #e4fedd;
  --color-realm-of-the-underworld-100: #d8f5d0;
  --color-realm-of-the-underworld-200: #c1e3b8;
  --color-realm-of-the-underworld-300: #a7ce9c;
  --color-realm-of-the-underworld-400: #84b079;
  --color-realm-of-the-underworld-500: #68945d;
  --color-realm-of-the-underworld-600: #4f7944;
  --color-realm-of-the-underworld-700: #3b6131;
  --color-realm-of-the-underworld-800: #2b4d22;
  --color-realm-of-the-underworld-900: #153e07;
  --color-realm-of-the-underworld-950: #11260b;
}

Similar palettes