Neon Boneyard to Queen of Trees Color Palette

About this palette

Neon Boneyard to Queen of Trees is a 5-color cool palette: #E1CDFF (Neon Boneyard), #B697F5 (Dreamy Candy Forest), #2B9048 (Wild Forest), #832F44 (Blood Oath), #1D3C23 (Queen of Trees). It mixes purple, green, red tones and feels cool overall. The strongest text pairing is #E1CDFF on #1D3C23 with a contrast ratio of 8.35:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Neon Boneyard	rgb(225, 205, 255)	hsl(264, 100%, 90%)
Dreamy Candy Forest	rgb(182, 151, 245)	hsl(260, 82%, 78%)
Wild Forest	rgb(43, 144, 72)	hsl(137, 54%, 37%)
Blood Oath	rgb(131, 47, 68)	hsl(345, 47%, 35%)
Queen of Trees	rgb(29, 60, 35)	hsl(132, 35%, 17%)

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.35:1 Very good#E1CDFF on #1D3C23
Aa8.35:1 Very good#1D3C23 on #E1CDFF
Aa5.86:1 Good#E1CDFF on #832F44
Aa5.86:1 Good#832F44 on #E1CDFF
Aa5.07:1 Good#B697F5 on #1D3C23
Aa5.07:1 Good#1D3C23 on #B697F5
Aa3.56:1 Poor#B697F5 on #832F44
Aa3.56:1 Poor#832F44 on #B697F5

Color blindness preview

CSS variables

/* Neon Boneyard to Queen of Trees — https://swatchly.xyz/palette/e1cdff-b697f5-2b9048-832f44-1d3c23 */
:root {
  --neon-boneyard: #e1cdff;
  --dreamy-candy-forest: #b697f5;
  --wild-forest: #2b9048;
  --blood-oath: #832f44;
  --queen-of-trees: #1d3c23;
}

Tailwind CSS v4

/* Neon Boneyard to Queen of Trees — https://swatchly.xyz/palette/e1cdff-b697f5-2b9048-832f44-1d3c23 */
@theme {
  --color-neon-boneyard: #e1cdff;
  --color-neon-boneyard-50: #f7f3ff;
  --color-neon-boneyard-100: #f0e6ff;
  --color-neon-boneyard-200: #e1cdff;
  --color-neon-boneyard-300: #c9b8e2;
  --color-neon-boneyard-400: #aa98c5;
  --color-neon-boneyard-500: #8f7caa;
  --color-neon-boneyard-600: #74628d;
  --color-neon-boneyard-700: #5d4c73;
  --color-neon-boneyard-800: #493a5d;
  --color-neon-boneyard-900: #382c49;
  --color-neon-boneyard-950: #231a2f;
  --color-dreamy-candy-forest: #b697f5;
  --color-dreamy-candy-forest-50: #f9f7ff;
  --color-dreamy-candy-forest-100: #f2edff;
  --color-dreamy-candy-forest-200: #e2d7ff;
  --color-dreamy-candy-forest-300: #d0bcff;
  --color-dreamy-candy-forest-400: #b697f5;
  --color-dreamy-candy-forest-500: #997ad4;
  --color-dreamy-candy-forest-600: #7c5db5;
  --color-dreamy-candy-forest-700: #634696;
  --color-dreamy-candy-forest-800: #4e337a;
  --color-dreamy-candy-forest-900: #3c2560;
  --color-dreamy-candy-forest-950: #25143e;
  --color-wild-forest: #2b9048;
  --color-wild-forest-50: #d7ffdd;
  --color-wild-forest-100: #bcf8c6;
  --color-wild-forest-200: #9de5a9;
  --color-wild-forest-300: #7bcf8b;
  --color-wild-forest-400: #50ae66;
  --color-wild-forest-500: #2b9048;
  --color-wild-forest-600: #097632;
  --color-wild-forest-700: #005f25;
  --color-wild-forest-800: #004b1c;
  --color-wild-forest-900: #003b14;
  --color-wild-forest-950: #00260a;
  --color-blood-oath: #832f44;
  --color-blood-oath-50: #fff1f3;
  --color-blood-oath-100: #ffe3e7;
  --color-blood-oath-200: #ffc5ce;
  --color-blood-oath-300: #f8a4b3;
  --color-blood-oath-400: #da8091;
  --color-blood-oath-500: #bd6375;
  --color-blood-oath-600: #9d485b;
  --color-blood-oath-700: #832f44;
  --color-blood-oath-800: #662535;
  --color-blood-oath-900: #511a28;
  --color-blood-oath-950: #350d17;
  --color-queen-of-trees: #1d3c23;
  --color-queen-of-trees-50: #e7fcea;
  --color-queen-of-trees-100: #dcf2de;
  --color-queen-of-trees-200: #c5e0c8;
  --color-queen-of-trees-300: #accab0;
  --color-queen-of-trees-400: #8aac8f;
  --color-queen-of-trees-500: #6f9174;
  --color-queen-of-trees-600: #55765a;
  --color-queen-of-trees-700: #415f46;
  --color-queen-of-trees-800: #314b35;
  --color-queen-of-trees-900: #1d3c23;
  --color-queen-of-trees-950: #152517;
}