Green Goddess to Venus Violet color palette

About this palette

Green Goddess to Venus Violet is a 4-color vintage palette: #78B18F (Green Goddess), #4C520C (Godzilla), #FFE1EC (Watermelon Mousse), #7974C6 (Venus Violet). It mixes green, pink, purple tones and feels balanced overall. The strongest text pairing is #4C520C on #FFE1EC with a contrast ratio of 6.84:1, and 1 of its 6 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Green Goddessrgb(120, 177, 143)hsl(144, 27%, 58%)
Godzillargb(76, 82, 12)hsl(65, 74%, 18%)
Watermelon Moussergb(255, 225, 236)hsl(338, 100%, 94%)
Venus Violetrgb(121, 116, 198)hsl(244, 42%, 62%)

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.84:1 Good#4C520C on #FFE1EC
  • Aa6.84:1 Good#FFE1EC on #4C520C
  • Aa3.37:1 Poor#78B18F on #4C520C
  • Aa3.37:1 Poor#4C520C on #78B18F
  • Aa3.36:1 Poor#FFE1EC on #7974C6
  • Aa3.36:1 Poor#7974C6 on #FFE1EC

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Green Goddess to Venus Violet — https://swatchly.xyz/palette/78b18f-4c520c-ffe1ec-7974c6 */
:root {
  --green-goddess: #78b18f;
  --godzilla: #4c520c;
  --watermelon-mousse: #ffe1ec;
  --venus-violet: #7974c6;
}

Tailwind CSS v4

/* Green Goddess to Venus Violet — https://swatchly.xyz/palette/78b18f-4c520c-ffe1ec-7974c6 */
@theme {
  --color-green-goddess: #78b18f;
  --color-green-goddess-50: #dfffea;
  --color-green-goddess-100: #d2f6df;
  --color-green-goddess-200: #b9e4c9;
  --color-green-goddess-300: #9ecfb1;
  --color-green-goddess-400: #78b18f;
  --color-green-goddess-500: #5d9574;
  --color-green-goddess-600: #437a5b;
  --color-green-goddess-700: #2f6246;
  --color-green-goddess-800: #204d35;
  --color-green-goddess-900: #153c27;
  --color-green-goddess-950: #092517;
  --color-godzilla: #4c520c;
  --color-godzilla-50: #f4fad5;
  --color-godzilla-100: #eaf0c7;
  --color-godzilla-200: #d4dcaa;
  --color-godzilla-300: #bcc48b;
  --color-godzilla-400: #9ba364;
  --color-godzilla-500: #7f8646;
  --color-godzilla-600: #636a2c;
  --color-godzilla-700: #4c520c;
  --color-godzilla-800: #3b400d;
  --color-godzilla-900: #2d3106;
  --color-godzilla-950: #1b1e02;
  --color-watermelon-mousse: #ffe1ec;
  --color-watermelon-mousse-50: #fff0f5;
  --color-watermelon-mousse-100: #ffe1ec;
  --color-watermelon-mousse-200: #e6d0d8;
  --color-watermelon-mousse-300: #d1b9c2;
  --color-watermelon-mousse-400: #b399a3;
  --color-watermelon-mousse-500: #987d87;
  --color-watermelon-mousse-600: #7d646d;
  --color-watermelon-mousse-700: #654e57;
  --color-watermelon-mousse-800: #503c43;
  --color-watermelon-mousse-900: #3e2d34;
  --color-watermelon-mousse-950: #271b20;
  --color-venus-violet: #7974c6;
  --color-venus-violet-50: #f2f3ff;
  --color-venus-violet-100: #e6e6ff;
  --color-venus-violet-200: #cfcfff;
  --color-venus-violet-300: #b5b3ff;
  --color-venus-violet-400: #9591e3;
  --color-venus-violet-500: #7974c6;
  --color-venus-violet-600: #615ba8;
  --color-venus-violet-700: #4c468c;
  --color-venus-violet-800: #3b3572;
  --color-venus-violet-900: #2e285c;
  --color-venus-violet-950: #1c183d;
}

Similar palettes