Andromeda Blue to Eternal Darkness color palette

B1CDF6Andromeda Blue C39ACCPastel Violet 8E6B0EMuddy Brown 2B6237Midori 1D2B3DEternal Darkness

About this palette

Andromeda Blue to Eternal Darkness is a 5-color cool palette: #B1CDF6 (Andromeda Blue), #C39ACC (Pastel Violet), #8E6B0E (Muddy Brown), #2B6237 (Midori), #1D2B3D (Eternal Darkness). It mixes blue, purple, brown, green tones and feels cool overall. The strongest text pairing is #B1CDF6 on #1D2B3D with a contrast ratio of 8.83:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Andromeda Blue	rgb(177, 205, 246)	hsl(216, 79%, 83%)
Pastel Violet	rgb(195, 154, 204)	hsl(289, 33%, 70%)
Muddy Brown	rgb(142, 107, 14)	hsl(44, 82%, 31%)
Midori	rgb(43, 98, 55)	hsl(133, 39%, 28%)
Eternal Darkness	rgb(29, 43, 61)	hsl(214, 36%, 18%)

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.

Aa8.83:1 Very good#B1CDF6 on #1D2B3D
Aa8.83:1 Very good#1D2B3D on #B1CDF6
Aa6.02:1 Good#C39ACC on #1D2B3D
Aa6.02:1 Good#1D2B3D on #C39ACC
Aa4.45:1 Poor#B1CDF6 on #2B6237
Aa4.45:1 Poor#2B6237 on #B1CDF6
Aa3.04:1 Poor#B1CDF6 on #8E6B0E
Aa3.04:1 Poor#8E6B0E on #B1CDF6

Color blindness preview

CSS variables

/* Andromeda Blue to Eternal Darkness — https://swatchly.xyz/palette/b1cdf6-c39acc-8e6b0e-2b6237-1d2b3d */
:root {
  --andromeda-blue: #b1cdf6;
  --pastel-violet: #c39acc;
  --muddy-brown: #8e6b0e;
  --midori: #2b6237;
  --eternal-darkness: #1d2b3d;
}

Tailwind CSS v4

/* Andromeda Blue to Eternal Darkness — https://swatchly.xyz/palette/b1cdf6-c39acc-8e6b0e-2b6237-1d2b3d */
@theme {
  --color-andromeda-blue: #b1cdf6;
  --color-andromeda-blue-50: #f8fbff;
  --color-andromeda-blue-100: #ebf3ff;
  --color-andromeda-blue-200: #cee2ff;
  --color-andromeda-blue-300: #b1cdf6;
  --color-andromeda-blue-400: #92abd1;
  --color-andromeda-blue-500: #748eb4;
  --color-andromeda-blue-600: #597296;
  --color-andromeda-blue-700: #43597a;
  --color-andromeda-blue-800: #314461;
  --color-andromeda-blue-900: #23334b;
  --color-andromeda-blue-950: #142031;
  --color-pastel-violet: #c39acc;
  --color-pastel-violet-50: #fdf5ff;
  --color-pastel-violet-100: #fbe9ff;
  --color-pastel-violet-200: #f0d2f7;
  --color-pastel-violet-300: #debbe5;
  --color-pastel-violet-400: #c39acc;
  --color-pastel-violet-500: #a57dad;
  --color-pastel-violet-600: #876190;
  --color-pastel-violet-700: #6d4a75;
  --color-pastel-violet-800: #56385d;
  --color-pastel-violet-900: #422948;
  --color-pastel-violet-950: #29172d;
  --color-muddy-brown: #8e6b0e;
  --color-muddy-brown-50: #fff4de;
  --color-muddy-brown-100: #ffeabf;
  --color-muddy-brown-200: #f2d69e;
  --color-muddy-brown-300: #dfc07e;
  --color-muddy-brown-400: #c3a055;
  --color-muddy-brown-500: #a98533;
  --color-muddy-brown-600: #8e6b0e;
  --color-muddy-brown-700: #725400;
  --color-muddy-brown-800: #594100;
  --color-muddy-brown-900: #453200;
  --color-muddy-brown-950: #2c1e00;
  --color-midori: #2b6237;
  --color-midori-50: #dfffe3;
  --color-midori-100: #d2f6d7;
  --color-midori-200: #b9e4bf;
  --color-midori-300: #9ecfa5;
  --color-midori-400: #7ab083;
  --color-midori-500: #5d9567;
  --color-midori-600: #43794e;
  --color-midori-700: #2b6237;
  --color-midori-800: #214d2a;
  --color-midori-900: #163b1e;
  --color-midori-950: #0a2510;
  --color-eternal-darkness: #1d2b3d;
  --color-eternal-darkness-50: #eff6ff;
  --color-eternal-darkness-100: #e1ecfb;
  --color-eternal-darkness-200: #cbd9eb;
  --color-eternal-darkness-300: #b3c2d6;
  --color-eternal-darkness-400: #91a1b7;
  --color-eternal-darkness-500: #74849a;
  --color-eternal-darkness-600: #59687c;
  --color-eternal-darkness-700: #425062;
  --color-eternal-darkness-800: #303c4b;
  --color-eternal-darkness-900: #1d2b3d;
  --color-eternal-darkness-950: #131921;
}