Enchanted Forest to Sky Color Palette

About this palette

Enchanted Forest to Sky is a 5-color cool, earthy palette: #598326 (Enchanted Forest), #B8826B (Silken Chocolate), #FDDEFF (Bunny Tail), #435634 (Zen Garden Olive), #81D8F2 (Sky). It mixes green, orange, pink, blue tones and feels cool overall. The strongest text pairing is #FDDEFF on #435634 with a contrast ratio of 6.52:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Enchanted Forest	rgb(89, 131, 38)	hsl(87, 55%, 33%)
Silken Chocolate	rgb(184, 130, 107)	hsl(18, 35%, 57%)
Bunny Tail	rgb(253, 222, 255)	hsl(296, 100%, 94%)
Zen Garden Olive	rgb(67, 86, 52)	hsl(94, 25%, 27%)
Sky	rgb(129, 216, 242)	hsl(194, 81%, 73%)

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.

Aa6.52:1 Good#FDDEFF on #435634
Aa6.52:1 Good#435634 on #FDDEFF
Aa4.98:1 Good#435634 on #81D8F2
Aa4.98:1 Good#81D8F2 on #435634
Aa3.63:1 Poor#598326 on #FDDEFF
Aa3.63:1 Poor#FDDEFF on #598326

Color blindness preview

CSS variables

/* Enchanted Forest to Sky — https://swatchly.xyz/palette/598326-b8826b-fddeff-435634-81d8f2 */
:root {
  --enchanted-forest: #598326;
  --silken-chocolate: #b8826b;
  --bunny-tail: #fddeff;
  --zen-garden-olive: #435634;
  --sky: #81d8f2;
}

Tailwind CSS v4

/* Enchanted Forest to Sky — https://swatchly.xyz/palette/598326-b8826b-fddeff-435634-81d8f2 */
@theme {
  --color-enchanted-forest: #598326;
  --color-enchanted-forest-50: #e6ffd0;
  --color-enchanted-forest-100: #dbf8c1;
  --color-enchanted-forest-200: #c5e8a6;
  --color-enchanted-forest-300: #add489;
  --color-enchanted-forest-400: #8db762;
  --color-enchanted-forest-500: #729d43;
  --color-enchanted-forest-600: #598326;
  --color-enchanted-forest-700: #43690b;
  --color-enchanted-forest-800: #325200;
  --color-enchanted-forest-900: #253f00;
  --color-enchanted-forest-950: #162800;
  --color-silken-chocolate: #b8826b;
  --color-silken-chocolate-50: #fff5f0;
  --color-silken-chocolate-100: #ffeae1;
  --color-silken-chocolate-200: #fdd3c1;
  --color-silken-chocolate-300: #ecbca8;
  --color-silken-chocolate-400: #d19d87;
  --color-silken-chocolate-500: #b8826b;
  --color-silken-chocolate-600: #996650;
  --color-silken-chocolate-700: #7d4e3a;
  --color-silken-chocolate-800: #643b29;
  --color-silken-chocolate-900: #4e2c1c;
  --color-silken-chocolate-950: #32190e;
  --color-bunny-tail: #fddeff;
  --color-bunny-tail-50: #feeeff;
  --color-bunny-tail-100: #fddeff;
  --color-bunny-tail-200: #e5cee6;
  --color-bunny-tail-300: #d0b6d2;
  --color-bunny-tail-400: #b296b4;
  --color-bunny-tail-500: #977b99;
  --color-bunny-tail-600: #7c617d;
  --color-bunny-tail-700: #644c65;
  --color-bunny-tail-800: #4f3a50;
  --color-bunny-tail-900: #3d2c3f;
  --color-bunny-tail-950: #271a28;
  --color-zen-garden-olive: #435634;
  --color-zen-garden-olive-50: #edfae4;
  --color-zen-garden-olive-100: #e2f1d8;
  --color-zen-garden-olive-200: #ccddbf;
  --color-zen-garden-olive-300: #b3c6a5;
  --color-zen-garden-olive-400: #91a682;
  --color-zen-garden-olive-500: #758965;
  --color-zen-garden-olive-600: #5a6e4b;
  --color-zen-garden-olive-700: #435634;
  --color-zen-garden-olive-800: #344328;
  --color-zen-garden-olive-900: #27341d;
  --color-zen-garden-olive-950: #172010;
  --color-sky: #81d8f2;
  --color-sky-50: #f1fcff;
  --color-sky-100: #dcf6ff;
  --color-sky-200: #b0eafc;
  --color-sky-300: #81d8f2;
  --color-sky-400: #65b5cd;
  --color-sky-500: #4098b1;
  --color-sky-600: #1c7c93;
  --color-sky-700: #006277;
  --color-sky-800: #004c5d;
  --color-sky-900: #003947;
  --color-sky-950: #00242d;
}