Her Fierceness to Hello Winter color palette

6C1A40Her Fierceness 647E00Enchanted Forest 9F85D0Petrified Purple A7BE68Sapling 91FFEFHello Winter

About this palette

Her Fierceness to Hello Winter is a 5-color cool palette: #6C1A40 (Her Fierceness), #647E00 (Enchanted Forest), #9F85D0 (Petrified Purple), #A7BE68 (Sapling), #91FFEF (Hello Winter). It mixes red, green, purple, turquoise tones and feels cool overall. The strongest text pairing is #6C1A40 on #91FFEF with a contrast ratio of 9.55:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Her Fierceness	rgb(108, 26, 64)	hsl(332, 61%, 26%)
Enchanted Forest	rgb(100, 126, 0)	hsl(72, 100%, 25%)
Petrified Purple	rgb(159, 133, 208)	hsl(261, 44%, 67%)
Sapling	rgb(167, 190, 104)	hsl(76, 40%, 58%)
Hello Winter	rgb(145, 255, 239)	hsl(171, 100%, 78%)

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.

Aa9.55:1 Very good#6C1A40 on #91FFEF
Aa9.55:1 Very good#91FFEF on #6C1A40
Aa5.49:1 Good#6C1A40 on #A7BE68
Aa5.49:1 Good#A7BE68 on #6C1A40
Aa3.92:1 Poor#647E00 on #91FFEF
Aa3.92:1 Poor#91FFEF on #647E00
Aa3.62:1 Poor#6C1A40 on #9F85D0
Aa3.62:1 Poor#9F85D0 on #6C1A40

Color blindness preview

CSS variables

/* Her Fierceness to Hello Winter — https://swatchly.xyz/palette/6c1a40-647e00-9f85d0-a7be68-91ffef */
:root {
  --her-fierceness: #6c1a40;
  --enchanted-forest: #647e00;
  --petrified-purple: #9f85d0;
  --sapling: #a7be68;
  --hello-winter: #91ffef;
}

Tailwind CSS v4

/* Her Fierceness to Hello Winter — https://swatchly.xyz/palette/6c1a40-647e00-9f85d0-a7be68-91ffef */
@theme {
  --color-her-fierceness: #6c1a40;
  --color-her-fierceness-50: #fff1f5;
  --color-her-fierceness-100: #ffe2ec;
  --color-her-fierceness-200: #ffc5d8;
  --color-her-fierceness-300: #f6a4c2;
  --color-her-fierceness-400: #d980a2;
  --color-her-fierceness-500: #bc6386;
  --color-her-fierceness-600: #9d496b;
  --color-her-fierceness-700: #7f3453;
  --color-her-fierceness-800: #6c1a40;
  --color-her-fierceness-900: #501931;
  --color-her-fierceness-950: #340d1e;
  --color-enchanted-forest: #647e00;
  --color-enchanted-forest-50: #ecfec7;
  --color-enchanted-forest-100: #e2f6b9;
  --color-enchanted-forest-200: #cee59c;
  --color-enchanted-forest-300: #b7d17c;
  --color-enchanted-forest-400: #97b352;
  --color-enchanted-forest-500: #7d982e;
  --color-enchanted-forest-600: #647e00;
  --color-enchanted-forest-700: #4f6400;
  --color-enchanted-forest-800: #3d4e00;
  --color-enchanted-forest-900: #2e3c00;
  --color-enchanted-forest-950: #1c2500;
  --color-petrified-purple: #9f85d0;
  --color-petrified-purple-50: #f3edff;
  --color-petrified-purple-100: #e8deff;
  --color-petrified-purple-200: #d6c3ff;
  --color-petrified-purple-300: #bfa8ee;
  --color-petrified-purple-400: #9f85d0;
  --color-petrified-purple-500: #866cb5;
  --color-petrified-purple-600: #6d5499;
  --color-petrified-purple-700: #58417f;
  --color-petrified-purple-800: #463268;
  --color-petrified-purple-900: #372654;
  --color-petrified-purple-950: #241739;
  --color-sapling: #a7be68;
  --color-sapling-50: #e6f6c2;
  --color-sapling-100: #d9eab0;
  --color-sapling-200: #c1d591;
  --color-sapling-300: #a7be68;
  --color-sapling-400: #8ba14d;
  --color-sapling-500: #738731;
  --color-sapling-600: #5c6f17;
  --color-sapling-700: #485901;
  --color-sapling-800: #394700;
  --color-sapling-900: #2d3800;
  --color-sapling-950: #1b2300;
  --color-hello-winter: #91ffef;
  --color-hello-winter-50: #cafff6;
  --color-hello-winter-100: #91ffef;
  --color-hello-winter-200: #98e6da;
  --color-hello-winter-300: #76d2c5;
  --color-hello-winter-400: #48b4a6;
  --color-hello-winter-500: #19998c;
  --color-hello-winter-600: #007d71;
  --color-hello-winter-700: #00635a;
  --color-hello-winter-800: #004e46;
  --color-hello-winter-900: #003c36;
  --color-hello-winter-950: #002621;
}