Testosterose to Go Go Green Color Palette

About this palette

Testosterose to Go Go Green is a 5-color vibrant, cool palette: #E5A8FF (Testosterose), #E5486C (Radishical), #A3A100 (Countryside), #B38EFF (Dreamy Candy Forest), #008B7D (Go Go Green). It mixes purple, red, yellow, turquoise tones and feels cool overall. The strongest text pairing is #E5A8FF on #008B7D with a contrast ratio of 2.28:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Testosterose	rgb(229, 168, 255)	hsl(282, 100%, 83%)
Radishical	rgb(229, 72, 108)	hsl(346, 75%, 59%)
Countryside	rgb(163, 161, 0)	hsl(59, 100%, 32%)
Dreamy Candy Forest	rgb(179, 142, 255)	hsl(260, 100%, 78%)
Go Go Green	rgb(0, 139, 125)	hsl(174, 100%, 27%)

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

/* Testosterose to Go Go Green — https://swatchly.xyz/palette/e5a8ff-e5486c-a3a100-b38eff-008b7d */
:root {
  --testosterose: #e5a8ff;
  --radishical: #e5486c;
  --countryside: #a3a100;
  --dreamy-candy-forest: #b38eff;
  --go-go-green: #008b7d;
}

Tailwind CSS v4

/* Testosterose to Go Go Green — https://swatchly.xyz/palette/e5a8ff-e5486c-a3a100-b38eff-008b7d */
@theme {
  --color-testosterose: #e5a8ff;
  --color-testosterose-50: #fbf3ff;
  --color-testosterose-100: #f7e6ff;
  --color-testosterose-200: #efcaff;
  --color-testosterose-300: #e5a8ff;
  --color-testosterose-400: #c28ada;
  --color-testosterose-500: #a76cbf;
  --color-testosterose-600: #8a52a1;
  --color-testosterose-700: #703c85;
  --color-testosterose-800: #592c6b;
  --color-testosterose-900: #461f55;
  --color-testosterose-950: #2d1138;
  --color-radishical: #e5486c;
  --color-radishical-50: #fff2f3;
  --color-radishical-100: #ffe5e8;
  --color-radishical-200: #ffc9cf;
  --color-radishical-300: #ffa7b2;
  --color-radishical-400: #ff6c88;
  --color-radishical-500: #e5486c;
  --color-radishical-600: #c32752;
  --color-radishical-700: #a3053e;
  --color-radishical-800: #81002f;
  --color-radishical-900: #650023;
  --color-radishical-950: #420014;
  --color-countryside: #a3a100;
  --color-countryside-50: #f7f8b6;
  --color-countryside-100: #eceda2;
  --color-countryside-200: #d9d97e;
  --color-countryside-300: #c2c255;
  --color-countryside-400: #a3a100;
  --color-countryside-500: #888600;
  --color-countryside-600: #6d6c00;
  --color-countryside-700: #575600;
  --color-countryside-800: #444300;
  --color-countryside-900: #353400;
  --color-countryside-950: #212100;
  --color-dreamy-candy-forest: #b38eff;
  --color-dreamy-candy-forest-50: #f8f5ff;
  --color-dreamy-candy-forest-100: #f0ebff;
  --color-dreamy-candy-forest-200: #dfd4ff;
  --color-dreamy-candy-forest-300: #ccb8ff;
  --color-dreamy-candy-forest-400: #b38eff;
  --color-dreamy-candy-forest-500: #9771df;
  --color-dreamy-candy-forest-600: #7b55bf;
  --color-dreamy-candy-forest-700: #633ea0;
  --color-dreamy-candy-forest-800: #4e2d82;
  --color-dreamy-candy-forest-900: #3c1f68;
  --color-dreamy-candy-forest-950: #251045;
  --color-go-go-green: #008b7d;
  --color-go-go-green-50: #d7fff7;
  --color-go-go-green-100: #c0fcf1;
  --color-go-go-green-200: #a5ece0;
  --color-go-go-green-300: #86dacc;
  --color-go-go-green-400: #5bbeaf;
  --color-go-go-green-500: #35a596;
  --color-go-go-green-600: #008b7d;
  --color-go-go-green-700: #006e63;
  --color-go-go-green-800: #00564d;
  --color-go-go-green-900: #00423b;
  --color-go-go-green-950: #002924;
}