Enchanted Forest to Grape Taffy Color Palette

About this palette

Enchanted Forest to Grape Taffy is a 5-color cool palette: #698200 (Enchanted Forest), #9974C8 (Viola), #D9ACFF (Testosterose), #354500 (Treetop Cathedral), #F0DCFF (Grape Taffy). It mixes green, purple tones and feels cool overall. The strongest text pairing is #354500 on #F0DCFF with a contrast ratio of 8.18:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Enchanted Forest	rgb(105, 130, 0)	hsl(72, 100%, 25%)
Viola	rgb(153, 116, 200)	hsl(266, 43%, 62%)
Testosterose	rgb(217, 172, 255)	hsl(273, 100%, 84%)
Treetop Cathedral	rgb(53, 69, 0)	hsl(74, 100%, 14%)
Grape Taffy	rgb(240, 220, 255)	hsl(274, 100%, 93%)

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.18:1 Very good#354500 on #F0DCFF
Aa8.18:1 Very good#F0DCFF on #354500
Aa5.64:1 Good#D9ACFF on #354500
Aa5.64:1 Good#354500 on #D9ACFF
Aa3.42:1 Poor#698200 on #F0DCFF
Aa3.42:1 Poor#F0DCFF on #698200

Color blindness preview

CSS variables

/* Enchanted Forest to Grape Taffy — https://swatchly.xyz/palette/698200-9974c8-d9acff-354500-f0dcff */
:root {
  --enchanted-forest: #698200;
  --viola: #9974c8;
  --testosterose: #d9acff;
  --treetop-cathedral: #354500;
  --grape-taffy: #f0dcff;
}

Tailwind CSS v4

/* Enchanted Forest to Grape Taffy — https://swatchly.xyz/palette/698200-9974c8-d9acff-354500-f0dcff */
@theme {
  --color-enchanted-forest: #698200;
  --color-enchanted-forest-50: #ecfec6;
  --color-enchanted-forest-100: #e3f7b9;
  --color-enchanted-forest-200: #d0e69d;
  --color-enchanted-forest-300: #bad37d;
  --color-enchanted-forest-400: #9bb653;
  --color-enchanted-forest-500: #819c2f;
  --color-enchanted-forest-600: #698200;
  --color-enchanted-forest-700: #536700;
  --color-enchanted-forest-800: #405000;
  --color-enchanted-forest-900: #303e00;
  --color-enchanted-forest-950: #1d2600;
  --color-viola: #9974c8;
  --color-viola-50: #f8f3ff;
  --color-viola-100: #f0e7ff;
  --color-viola-200: #e2cfff;
  --color-viola-300: #d1b2fd;
  --color-viola-400: #b490e3;
  --color-viola-500: #9974c8;
  --color-viola-600: #7d59aa;
  --color-viola-700: #65438d;
  --color-viola-800: #503272;
  --color-viola-900: #3e245b;
  --color-viola-950: #27143c;
  --color-testosterose: #d9acff;
  --color-testosterose-50: #f9f3ff;
  --color-testosterose-100: #f3e6ff;
  --color-testosterose-200: #e7ccff;
  --color-testosterose-300: #d9acff;
  --color-testosterose-400: #b88edb;
  --color-testosterose-500: #9c71bf;
  --color-testosterose-600: #8057a1;
  --color-testosterose-700: #684185;
  --color-testosterose-800: #52306c;
  --color-testosterose-900: #402356;
  --color-testosterose-950: #291438;
  --color-treetop-cathedral: #354500;
  --color-treetop-cathedral-50: #eefbd7;
  --color-treetop-cathedral-100: #e4f2ca;
  --color-treetop-cathedral-200: #cfdfaf;
  --color-treetop-cathedral-300: #b6c992;
  --color-treetop-cathedral-400: #95a96c;
  --color-treetop-cathedral-500: #798d4f;
  --color-treetop-cathedral-600: #5f7135;
  --color-treetop-cathedral-700: #495922;
  --color-treetop-cathedral-800: #354500;
  --color-treetop-cathedral-900: #29340b;
  --color-treetop-cathedral-950: #182004;
  --color-grape-taffy: #f0dcff;
  --color-grape-taffy-50: #f6ebff;
  --color-grape-taffy-100: #f0dcff;
  --color-grape-taffy-200: #dbcce6;
  --color-grape-taffy-300: #c6b5d3;
  --color-grape-taffy-400: #a996b6;
  --color-grape-taffy-500: #8e7c9c;
  --color-grape-taffy-600: #746381;
  --color-grape-taffy-700: #5e4e69;
  --color-grape-taffy-800: #4a3c54;
  --color-grape-taffy-900: #392d41;
  --color-grape-taffy-950: #241b2a;
}