Palm Leaf to Scented Spring color palette

About this palette

Palm Leaf to Scented Spring is a 5-color cool palette: #244D32 (Palm Leaf), #80459E (Purple Pleasures), #BE7689 (Prehistoric Pink), #93D598 (Botanist), #E4D7FF (Scented Spring). It mixes green, purple, pink tones and feels cool overall. The strongest text pairing is #244D32 on #E4D7FF with a contrast ratio of 7.08:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Palm Leafrgb(36, 77, 50)hsl(140, 36%, 22%)
Purple Pleasuresrgb(128, 69, 158)hsl(280, 39%, 45%)
Prehistoric Pinkrgb(190, 118, 137)hsl(344, 36%, 60%)
Botanistrgb(147, 213, 152)hsl(125, 44%, 71%)
Scented Springrgb(228, 215, 255)hsl(260, 100%, 92%)

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.

  • Aa7.08:1 Very good#244D32 on #E4D7FF
  • Aa7.08:1 Very good#E4D7FF on #244D32
  • Aa5.59:1 Good#244D32 on #93D598
  • Aa5.59:1 Good#93D598 on #244D32
  • Aa4.74:1 Good#80459E on #E4D7FF
  • Aa4.74:1 Good#E4D7FF on #80459E
  • Aa3.74:1 Poor#80459E on #93D598
  • Aa3.74:1 Poor#93D598 on #80459E

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Palm Leaf to Scented Spring — https://swatchly.xyz/palette/244d32-80459e-be7689-93d598-e4d7ff */
:root {
  --palm-leaf: #244d32;
  --purple-pleasures: #80459e;
  --prehistoric-pink: #be7689;
  --botanist: #93d598;
  --scented-spring: #e4d7ff;
}

Tailwind CSS v4

/* Palm Leaf to Scented Spring — https://swatchly.xyz/palette/244d32-80459e-be7689-93d598-e4d7ff */
@theme {
  --color-palm-leaf: #244d32;
  --color-palm-leaf-50: #e4fdea;
  --color-palm-leaf-100: #d8f4df;
  --color-palm-leaf-200: #c0e1c9;
  --color-palm-leaf-300: #a6ccb0;
  --color-palm-leaf-400: #84ae8f;
  --color-palm-leaf-500: #689274;
  --color-palm-leaf-600: #4e775b;
  --color-palm-leaf-700: #3a6046;
  --color-palm-leaf-800: #244d32;
  --color-palm-leaf-900: #1e3b27;
  --color-palm-leaf-950: #102517;
  --color-purple-pleasures: #80459e;
  --color-purple-pleasures-50: #faf1ff;
  --color-purple-pleasures-100: #f4e2ff;
  --color-purple-pleasures-200: #e9c4ff;
  --color-purple-pleasures-300: #d9a3f7;
  --color-purple-pleasures-400: #ba7fda;
  --color-purple-pleasures-500: #9d61bd;
  --color-purple-pleasures-600: #80459e;
  --color-purple-pleasures-700: #673481;
  --color-purple-pleasures-800: #522569;
  --color-purple-pleasures-900: #411a54;
  --color-purple-pleasures-950: #2a0e37;
  --color-prehistoric-pink: #be7689;
  --color-prehistoric-pink-50: #fff3f6;
  --color-prehistoric-pink-100: #ffe7ec;
  --color-prehistoric-pink-200: #ffccd8;
  --color-prehistoric-pink-300: #f3b2c2;
  --color-prehistoric-pink-400: #d892a3;
  --color-prehistoric-pink-500: #be7689;
  --color-prehistoric-pink-600: #9f5a6d;
  --color-prehistoric-pink-700: #824456;
  --color-prehistoric-pink-800: #693242;
  --color-prehistoric-pink-900: #522432;
  --color-prehistoric-pink-950: #35141e;
  --color-botanist: #93d598;
  --color-botanist-50: #e2ffe3;
  --color-botanist-100: #d0f9d2;
  --color-botanist-200: #b7e7ba;
  --color-botanist-300: #93d598;
  --color-botanist-400: #76b47b;
  --color-botanist-500: #58985f;
  --color-botanist-600: #3e7c45;
  --color-botanist-700: #2a6432;
  --color-botanist-800: #1b4f23;
  --color-botanist-900: #103d18;
  --color-botanist-950: #06270c;
  --color-scented-spring: #e4d7ff;
  --color-scented-spring-50: #fbf9ff;
  --color-scented-spring-100: #f3eeff;
  --color-scented-spring-200: #e4d7ff;
  --color-scented-spring-300: #cbc1e1;
  --color-scented-spring-400: #ab9fc3;
  --color-scented-spring-500: #8e82a7;
  --color-scented-spring-600: #73678a;
  --color-scented-spring-700: #5b506f;
  --color-scented-spring-800: #463d58;
  --color-scented-spring-900: #362e45;
  --color-scented-spring-950: #221c2c;
}

Similar palettes