Avocado to Groovy Lemon Pie Color Palette

About this palette

Avocado to Groovy Lemon Pie is a 5-color vibrant, cool palette: #5C8400 (Avocado), #746BFF (Pan Purple), #E9557A (Heather Berry), #00BBD5 (Caribbean Blue), #D5BE00 (Groovy Lemon Pie). It mixes green, purple, red, turquoise, yellow tones and feels cool overall. The strongest text pairing is #5C8400 on #D5BE00 with a contrast ratio of 2.35:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Avocado	rgb(92, 132, 0)	hsl(78, 100%, 26%)
Pan Purple	rgb(116, 107, 255)	hsl(244, 100%, 71%)
Heather Berry	rgb(233, 85, 122)	hsl(345, 77%, 62%)
Caribbean Blue	rgb(0, 187, 213)	hsl(187, 100%, 42%)
Groovy Lemon Pie	rgb(213, 190, 0)	hsl(54, 100%, 42%)

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.

Color blindness preview

CSS variables

/* Avocado to Groovy Lemon Pie — https://swatchly.xyz/palette/5c8400-746bff-e9557a-00bbd5-d5be00 */
:root {
  --avocado: #5c8400;
  --pan-purple: #746bff;
  --heather-berry: #e9557a;
  --caribbean-blue: #00bbd5;
  --groovy-lemon-pie: #d5be00;
}

Tailwind CSS v4

/* Avocado to Groovy Lemon Pie — https://swatchly.xyz/palette/5c8400-746bff-e9557a-00bbd5-d5be00 */
@theme {
  --color-avocado: #5c8400;
  --color-avocado-50: #e7ffcc;
  --color-avocado-100: #dcf9b9;
  --color-avocado-200: #c7e99d;
  --color-avocado-300: #afd57d;
  --color-avocado-400: #8fb853;
  --color-avocado-500: #759e2f;
  --color-avocado-600: #5c8400;
  --color-avocado-700: #486900;
  --color-avocado-800: #385200;
  --color-avocado-900: #2a3f00;
  --color-avocado-950: #192700;
  --color-pan-purple: #746bff;
  --color-pan-purple-50: #f3f4ff;
  --color-pan-purple-100: #e7e9ff;
  --color-pan-purple-200: #cfd3ff;
  --color-pan-purple-300: #b4b9ff;
  --color-pan-purple-400: #9092ff;
  --color-pan-purple-500: #746bff;
  --color-pan-purple-600: #5d4fde;
  --color-pan-purple-700: #4938bc;
  --color-pan-purple-800: #39269b;
  --color-pan-purple-900: #2b197e;
  --color-pan-purple-950: #1a0c55;
  --color-heather-berry: #e9557a;
  --color-heather-berry-50: #fff4f5;
  --color-heather-berry-100: #ffe9ec;
  --color-heather-berry-200: #ffcfd6;
  --color-heather-berry-300: #ffafbc;
  --color-heather-berry-400: #ff7996;
  --color-heather-berry-500: #e9557a;
  --color-heather-berry-600: #c6355e;
  --color-heather-berry-700: #a51948;
  --color-heather-berry-800: #860036;
  --color-heather-berry-900: #680028;
  --color-heather-berry-950: #430017;
  --color-caribbean-blue: #00bbd5;
  --color-caribbean-blue-50: #e9fbff;
  --color-caribbean-blue-100: #cef6ff;
  --color-caribbean-blue-200: #90ecff;
  --color-caribbean-blue-300: #68d8ed;
  --color-caribbean-blue-400: #00bbd5;
  --color-caribbean-blue-500: #009bb1;
  --color-caribbean-blue-600: #007d8f;
  --color-caribbean-blue-700: #006372;
  --color-caribbean-blue-800: #004d59;
  --color-caribbean-blue-900: #003b44;
  --color-caribbean-blue-950: #00242b;
  --color-groovy-lemon-pie: #d5be00;
  --color-groovy-lemon-pie-50: #fff5b4;
  --color-groovy-lemon-pie-100: #f8eb96;
  --color-groovy-lemon-pie-200: #e6d66e;
  --color-groovy-lemon-pie-300: #d5be00;
  --color-groovy-lemon-pie-400: #b39f00;
  --color-groovy-lemon-pie-500: #958400;
  --color-groovy-lemon-pie-600: #786b00;
  --color-groovy-lemon-pie-700: #605500;
  --color-groovy-lemon-pie-800: #4b4200;
  --color-groovy-lemon-pie-900: #3b3300;
  --color-groovy-lemon-pie-950: #252000;
}