Innocent Snowdrop to Forestial Outpost color palette

C8C8FFInnocent Snowdrop 343100Wasabi Nori BDB200Muddy Yellow 8574CBVenus Violet 625F0AForestial Outpost

Open in generator Export PNG, PDF, ASE…

About this palette

Innocent Snowdrop to Forestial Outpost is a 5-color warm, earthy palette: #C8C8FF (Innocent Snowdrop), #343100 (Wasabi Nori), #BDB200 (Muddy Yellow), #8574CB (Venus Violet), #625F0A (Forestial Outpost). It mixes purple, brown, yellow tones and feels warm overall. The strongest text pairing is #C8C8FF on #343100 with a contrast ratio of 8.30:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Innocent Snowdrop	rgb(200, 200, 255)	hsl(240, 100%, 89%)
Wasabi Nori	rgb(52, 49, 0)	hsl(57, 100%, 10%)
Muddy Yellow	rgb(189, 178, 0)	hsl(57, 100%, 37%)
Venus Violet	rgb(133, 116, 203)	hsl(252, 46%, 63%)
Forestial Outpost	rgb(98, 95, 10)	hsl(58, 81%, 21%)

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.30:1 Very good#C8C8FF on #343100
Aa8.30:1 Very good#343100 on #C8C8FF
Aa6.01:1 Good#343100 on #BDB200
Aa6.01:1 Good#BDB200 on #343100
Aa4.16:1 Poor#C8C8FF on #625F0A
Aa4.16:1 Poor#625F0A on #C8C8FF
Aa3.38:1 Poor#343100 on #8574CB
Aa3.38:1 Poor#8574CB on #343100

Color blindness preview

CSS variables

/* Innocent Snowdrop to Forestial Outpost — https://swatchly.xyz/palette/c8c8ff-343100-bdb200-8574cb-625f0a */
:root {
  --innocent-snowdrop: #c8c8ff;
  --wasabi-nori: #343100;
  --muddy-yellow: #bdb200;
  --venus-violet: #8574cb;
  --forestial-outpost: #625f0a;
}

Tailwind CSS v4

/* Innocent Snowdrop to Forestial Outpost — https://swatchly.xyz/palette/c8c8ff-343100-bdb200-8574cb-625f0a */
@theme {
  --color-innocent-snowdrop: #c8c8ff;
  --color-innocent-snowdrop-50: #ecedff;
  --color-innocent-snowdrop-100: #e0e0ff;
  --color-innocent-snowdrop-200: #c8c8ff;
  --color-innocent-snowdrop-300: #b4b4e4;
  --color-innocent-snowdrop-400: #9696c8;
  --color-innocent-snowdrop-500: #7d7cae;
  --color-innocent-snowdrop-600: #646393;
  --color-innocent-snowdrop-700: #504e79;
  --color-innocent-snowdrop-800: #3f3d63;
  --color-innocent-snowdrop-900: #302e4e;
  --color-innocent-snowdrop-950: #1d1c33;
  --color-wasabi-nori: #343100;
  --color-wasabi-nori-50: #f8f7dc;
  --color-wasabi-nori-100: #eeedcf;
  --color-wasabi-nori-200: #dbdab6;
  --color-wasabi-nori-300: #c5c49a;
  --color-wasabi-nori-400: #a6a476;
  --color-wasabi-nori-500: #8a8859;
  --color-wasabi-nori-600: #6f6c40;
  --color-wasabi-nori-700: #57552c;
  --color-wasabi-nori-800: #43411e;
  --color-wasabi-nori-900: #343100;
  --color-wasabi-nori-950: #1f1e08;
  --color-muddy-yellow: #bdb200;
  --color-muddy-yellow-50: #fffdcc;
  --color-muddy-yellow-100: #faf6ae;
  --color-muddy-yellow-200: #eae58d;
  --color-muddy-yellow-300: #d7d066;
  --color-muddy-yellow-400: #bdb200;
  --color-muddy-yellow-500: #9d9400;
  --color-muddy-yellow-600: #7e7600;
  --color-muddy-yellow-700: #635d00;
  --color-muddy-yellow-800: #4d4800;
  --color-muddy-yellow-900: #3a3600;
  --color-muddy-yellow-950: #232000;
  --color-venus-violet: #8574cb;
  --color-venus-violet-50: #f4f3ff;
  --color-venus-violet-100: #eae7ff;
  --color-venus-violet-200: #d6cfff;
  --color-venus-violet-300: #bfb3ff;
  --color-venus-violet-400: #a091e7;
  --color-venus-violet-500: #8574cb;
  --color-venus-violet-600: #6b5aad;
  --color-venus-violet-700: #564590;
  --color-venus-violet-800: #433475;
  --color-venus-violet-900: #34265e;
  --color-venus-violet-950: #20163e;
  --color-forestial-outpost: #625f0a;
  --color-forestial-outpost-50: #f8f8cf;
  --color-forestial-outpost-100: #efefc0;
  --color-forestial-outpost-200: #dddda6;
  --color-forestial-outpost-300: #c9c889;
  --color-forestial-outpost-400: #aba963;
  --color-forestial-outpost-500: #918f44;
  --color-forestial-outpost-600: #78752a;
  --color-forestial-outpost-700: #625f0a;
  --color-forestial-outpost-800: #4d4a02;
  --color-forestial-outpost-900: #3b3900;
  --color-forestial-outpost-950: #252300;
}