May Green to Asparagus Color Palette

About this palette

May Green to Asparagus is a 5-color cool, monochromatic palette: #4C933A (May Green), #256100 (Overgrown Temple), #90E181 (Snarky Mint), #1D4513 (Realm of the Underworld), #73AA4C (Asparagus). It mixes green tones and feels cool overall. The strongest text pairing is #90E181 on #1D4513 with a contrast ratio of 6.94:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
May Green	rgb(76, 147, 58)	hsl(108, 43%, 40%)
Overgrown Temple	rgb(37, 97, 0)	hsl(97, 100%, 19%)
Snarky Mint	rgb(144, 225, 129)	hsl(111, 62%, 69%)
Realm of the Underworld	rgb(29, 69, 19)	hsl(108, 57%, 17%)
Asparagus	rgb(115, 170, 76)	hsl(95, 38%, 48%)

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.94:1 Good#90E181 on #1D4513
Aa6.94:1 Good#1D4513 on #90E181
Aa4.76:1 Good#256100 on #90E181
Aa4.76:1 Good#90E181 on #256100
Aa3.96:1 Poor#1D4513 on #73AA4C
Aa3.96:1 Poor#73AA4C on #1D4513

Color blindness preview

CSS variables

/* May Green to Asparagus — https://swatchly.xyz/palette/4c933a-256100-90e181-1d4513-73aa4c */
:root {
  --may-green: #4c933a;
  --overgrown-temple: #256100;
  --snarky-mint: #90e181;
  --realm-of-the-underworld: #1d4513;
  --asparagus: #73aa4c;
}

Tailwind CSS v4

/* May Green to Asparagus — https://swatchly.xyz/palette/4c933a-256100-90e181-1d4513-73aa4c */
@theme {
  --color-may-green: #4c933a;
  --color-may-green-50: #deffd7;
  --color-may-green-100: #c9f8be;
  --color-may-green-200: #aee6a1;
  --color-may-green-300: #90d081;
  --color-may-green-400: #6ab059;
  --color-may-green-500: #4c933a;
  --color-may-green-600: #347821;
  --color-may-green-700: #21610c;
  --color-may-green-800: #144d00;
  --color-may-green-900: #0d3c00;
  --color-may-green-950: #062600;
  --color-overgrown-temple: #256100;
  --color-overgrown-temple-50: #e3ffda;
  --color-overgrown-temple-100: #d1f9c3;
  --color-overgrown-temple-200: #b7e7a6;
  --color-overgrown-temple-300: #9bd187;
  --color-overgrown-temple-400: #76b260;
  --color-overgrown-temple-500: #589541;
  --color-overgrown-temple-600: #3f7926;
  --color-overgrown-temple-700: #256100;
  --color-overgrown-temple-800: #1d4c03;
  --color-overgrown-temple-900: #133b00;
  --color-overgrown-temple-950: #092500;
  --color-snarky-mint: #90e181;
  --color-snarky-mint-50: #eeffeb;
  --color-snarky-mint-100: #d4ffcc;
  --color-snarky-mint-200: #b8f0ad;
  --color-snarky-mint-300: #90e181;
  --color-snarky-mint-400: #73be65;
  --color-snarky-mint-500: #52a143;
  --color-snarky-mint-600: #358326;
  --color-snarky-mint-700: #1f690c;
  --color-snarky-mint-800: #105200;
  --color-snarky-mint-900: #0a3f00;
  --color-snarky-mint-950: #042800;
  --color-realm-of-the-underworld: #1d4513;
  --color-realm-of-the-underworld-50: #e4fede;
  --color-realm-of-the-underworld-100: #d8f5d2;
  --color-realm-of-the-underworld-200: #c1e3b9;
  --color-realm-of-the-underworld-300: #a7ce9e;
  --color-realm-of-the-underworld-400: #86b17d;
  --color-realm-of-the-underworld-500: #6c9762;
  --color-realm-of-the-underworld-600: #537d4a;
  --color-realm-of-the-underworld-700: #406637;
  --color-realm-of-the-underworld-800: #305329;
  --color-realm-of-the-underworld-900: #1d4513;
  --color-realm-of-the-underworld-950: #152b10;
  --color-asparagus: #73aa4c;
  --color-asparagus-50: #dcfec8;
  --color-asparagus-100: #cdf4b6;
  --color-asparagus-200: #b4e198;
  --color-asparagus-300: #98ca77;
  --color-asparagus-400: #73aa4c;
  --color-asparagus-500: #5a9031;
  --color-asparagus-600: #437515;
  --color-asparagus-700: #315f00;
  --color-asparagus-800: #264b00;
  --color-asparagus-900: #1c3b00;
  --color-asparagus-950: #102600;
}