Ambrosia to Underworld Color Palette

About this palette

Ambrosia to Underworld is a 4-color gradient palette: #C1E5C1 (Ambrosia), #A1A564 (Willow Leaf), #0B6A5F (Terrestrial), #242719 (Underworld). It mixes green, yellow, turquoise, gray tones and feels cool overall. The strongest text pairing is #C1E5C1 on #242719 with a contrast ratio of 11.05:1, and 3 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Ambrosia	rgb(193, 229, 193)	hsl(120, 41%, 83%)
Willow Leaf	rgb(161, 165, 100)	hsl(64, 27%, 52%)
Terrestrial	rgb(11, 106, 95)	hsl(173, 81%, 23%)
Underworld	rgb(36, 39, 25)	hsl(73, 22%, 13%)

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.

Aa11.05:1 Very good#C1E5C1 on #242719
Aa11.05:1 Very good#242719 on #C1E5C1
Aa5.86:1 Good#A1A564 on #242719
Aa5.86:1 Good#242719 on #A1A564
Aa4.70:1 Good#C1E5C1 on #0B6A5F
Aa4.70:1 Good#0B6A5F on #C1E5C1

Color blindness preview

CSS variables

/* Ambrosia to Underworld — https://swatchly.xyz/palette/c1e5c1-a1a564-0b6a5f-242719 */
:root {
  --ambrosia: #c1e5c1;
  --willow-leaf: #a1a564;
  --terrestrial: #0b6a5f;
  --underworld: #242719;
}

Tailwind CSS v4

/* Ambrosia to Underworld — https://swatchly.xyz/palette/c1e5c1-a1a564-0b6a5f-242719 */
@theme {
  --color-ambrosia: #c1e5c1;
  --color-ambrosia-50: #e9fde9;
  --color-ambrosia-100: #def4de;
  --color-ambrosia-200: #c1e5c1;
  --color-ambrosia-300: #aeccae;
  --color-ambrosia-400: #8cad8c;
  --color-ambrosia-500: #709170;
  --color-ambrosia-600: #567657;
  --color-ambrosia-700: #415e42;
  --color-ambrosia-800: #304a31;
  --color-ambrosia-900: #243924;
  --color-ambrosia-950: #142415;
  --color-willow-leaf: #a1a564;
  --color-willow-leaf-50: #f5f8d3;
  --color-willow-leaf-100: #ebeec5;
  --color-willow-leaf-200: #d7dbaa;
  --color-willow-leaf-300: #c0c48c;
  --color-willow-leaf-400: #a1a564;
  --color-willow-leaf-500: #868a49;
  --color-willow-leaf-600: #6c6f30;
  --color-willow-leaf-700: #56581d;
  --color-willow-leaf-800: #434510;
  --color-willow-leaf-900: #343507;
  --color-willow-leaf-950: #202102;
  --color-terrestrial: #0b6a5f;
  --color-terrestrial-50: #d7fff7;
  --color-terrestrial-100: #c7f7ee;
  --color-terrestrial-200: #ade6dc;
  --color-terrestrial-300: #90d2c7;
  --color-terrestrial-400: #6ab5a9;
  --color-terrestrial-500: #4b9b8e;
  --color-terrestrial-600: #2e8075;
  --color-terrestrial-700: #0b6a5f;
  --color-terrestrial-800: #02534a;
  --color-terrestrial-900: #004039;
  --color-terrestrial-950: #002924;
  --color-underworld: #242719;
  --color-underworld-50: #f4f7ec;
  --color-underworld-100: #eaede1;
  --color-underworld-200: #d6d9cc;
  --color-underworld-300: #bfc3b4;
  --color-underworld-400: #a0a493;
  --color-underworld-500: #868a79;
  --color-underworld-600: #6d7060;
  --color-underworld-700: #575b4c;
  --color-underworld-800: #46493b;
  --color-underworld-900: #373a2e;
  --color-underworld-950: #242719;
}