Innocent Snowdrop to Blasphemous Blue Color Palette

About this palette

Innocent Snowdrop to Blasphemous Blue is a 5-color cool, earthy palette: #BDC5FF (Innocent Snowdrop), #D29D5F (Kombucha), #AD7400 (Falafel), #1D2F00 (Dark Serpent), #404CB9 (Blasphemous Blue). It mixes purple, orange, green, blue tones and feels cool overall. The strongest text pairing is #BDC5FF on #1D2F00 with a contrast ratio of 8.63:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Innocent Snowdrop	rgb(189, 197, 255)	hsl(233, 100%, 87%)
Kombucha	rgb(210, 157, 95)	hsl(32, 56%, 60%)
Falafel	rgb(173, 116, 0)	hsl(40, 100%, 34%)
Dark Serpent	rgb(29, 47, 0)	hsl(83, 100%, 9%)
Blasphemous Blue	rgb(64, 76, 185)	hsl(234, 49%, 49%)

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.63:1 Very good#BDC5FF on #1D2F00
Aa8.63:1 Very good#1D2F00 on #BDC5FF
Aa5.98:1 Good#D29D5F on #1D2F00
Aa5.98:1 Good#1D2F00 on #D29D5F
Aa4.27:1 Poor#BDC5FF on #404CB9
Aa4.27:1 Poor#404CB9 on #BDC5FF
Aa3.62:1 Poor#AD7400 on #1D2F00
Aa3.62:1 Poor#1D2F00 on #AD7400

Color blindness preview

CSS variables

/* Innocent Snowdrop to Blasphemous Blue — https://swatchly.xyz/palette/bdc5ff-d29d5f-ad7400-1d2f00-404cb9 */
:root {
  --innocent-snowdrop: #bdc5ff;
  --kombucha: #d29d5f;
  --falafel: #ad7400;
  --dark-serpent: #1d2f00;
  --blasphemous-blue: #404cb9;
}

Tailwind CSS v4

/* Innocent Snowdrop to Blasphemous Blue — https://swatchly.xyz/palette/bdc5ff-d29d5f-ad7400-1d2f00-404cb9 */
@theme {
  --color-innocent-snowdrop: #bdc5ff;
  --color-innocent-snowdrop-50: #f8f9ff;
  --color-innocent-snowdrop-100: #eef0ff;
  --color-innocent-snowdrop-200: #d7ddff;
  --color-innocent-snowdrop-300: #bdc5ff;
  --color-innocent-snowdrop-400: #9da4d9;
  --color-innocent-snowdrop-500: #8087bd;
  --color-innocent-snowdrop-600: #656b9e;
  --color-innocent-snowdrop-700: #4e5382;
  --color-innocent-snowdrop-800: #3b3f68;
  --color-innocent-snowdrop-900: #2c2f51;
  --color-innocent-snowdrop-950: #1a1d35;
  --color-kombucha: #d29d5f;
  --color-kombucha-50: #fff6ed;
  --color-kombucha-100: #ffebd6;
  --color-kombucha-200: #fcd5a9;
  --color-kombucha-300: #ebbe8b;
  --color-kombucha-400: #d29d5f;
  --color-kombucha-500: #b38042;
  --color-kombucha-600: #956425;
  --color-kombucha-700: #7a4d0c;
  --color-kombucha-800: #613b00;
  --color-kombucha-900: #4a2c00;
  --color-kombucha-950: #2f1a00;
  --color-falafel: #ad7400;
  --color-falafel-50: #fff2e1;
  --color-falafel-100: #ffe5c2;
  --color-falafel-200: #facc8c;
  --color-falafel-300: #e7b368;
  --color-falafel-400: #ca9138;
  --color-falafel-500: #ad7400;
  --color-falafel-600: #8c5d00;
  --color-falafel-700: #704900;
  --color-falafel-800: #583900;
  --color-falafel-900: #452c00;
  --color-falafel-950: #2c1a00;
  --color-dark-serpent: #1d2f00;
  --color-dark-serpent-50: #edfbde;
  --color-dark-serpent-100: #e2f2d2;
  --color-dark-serpent-200: #ccdfb9;
  --color-dark-serpent-300: #b4c99e;
  --color-dark-serpent-400: #94ab7b;
  --color-dark-serpent-500: #7a9161;
  --color-dark-serpent-600: #627849;
  --color-dark-serpent-700: #4f6237;
  --color-dark-serpent-800: #3e5029;
  --color-dark-serpent-900: #32411e;
  --color-dark-serpent-950: #1d2f00;
  --color-blasphemous-blue: #404cb9;
  --color-blasphemous-blue-50: #f2f5ff;
  --color-blasphemous-blue-100: #e5eaff;
  --color-blasphemous-blue-200: #ccd7ff;
  --color-blasphemous-blue-300: #b0c0ff;
  --color-blasphemous-blue-400: #889dff;
  --color-blasphemous-blue-500: #6b7ff0;
  --color-blasphemous-blue-600: #5464d2;
  --color-blasphemous-blue-700: #404cb9;
  --color-blasphemous-blue-800: #313a95;
  --color-blasphemous-blue-900: #242b78;
  --color-blasphemous-blue-950: #151951;
}