Godzilla to Dark Prom Queen Color Palette

About this palette

Godzilla to Dark Prom Queen is a 5-color cool palette: #404B00 (Godzilla), #55F6CD (Onsen), #B552C5 (Love Priestess), #A8C500 (Sour Lime), #311137 (Dark Prom Queen). It mixes green, turquoise, purple tones and feels cool overall. The strongest text pairing is #55F6CD on #311137 with a contrast ratio of 12.20:1, and 4 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Godzilla	rgb(64, 75, 0)	hsl(69, 100%, 15%)
Onsen	rgb(85, 246, 205)	hsl(165, 90%, 65%)
Love Priestess	rgb(181, 82, 197)	hsl(292, 50%, 55%)
Sour Lime	rgb(168, 197, 0)	hsl(69, 100%, 39%)
Dark Prom Queen	rgb(49, 17, 55)	hsl(291, 53%, 14%)

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.

Aa12.20:1 Super#55F6CD on #311137
Aa12.20:1 Super#311137 on #55F6CD
Aa8.41:1 Very good#A8C500 on #311137
Aa8.41:1 Very good#311137 on #A8C500
Aa6.95:1 Good#404B00 on #55F6CD
Aa6.95:1 Good#55F6CD on #404B00
Aa4.79:1 Good#404B00 on #A8C500
Aa4.79:1 Good#A8C500 on #404B00

Color blindness preview

CSS variables

/* Godzilla to Dark Prom Queen — https://swatchly.xyz/palette/404b00-55f6cd-b552c5-a8c500-311137 */
:root {
  --godzilla: #404b00;
  --onsen: #55f6cd;
  --love-priestess: #b552c5;
  --sour-lime: #a8c500;
  --dark-prom-queen: #311137;
}

Tailwind CSS v4

/* Godzilla to Dark Prom Queen — https://swatchly.xyz/palette/404b00-55f6cd-b552c5-a8c500-311137 */
@theme {
  --color-godzilla: #404b00;
  --color-godzilla-50: #f1fbd5;
  --color-godzilla-100: #e7f1c7;
  --color-godzilla-200: #d2deac;
  --color-godzilla-300: #bcc990;
  --color-godzilla-400: #9caa6b;
  --color-godzilla-500: #828f4e;
  --color-godzilla-600: #687534;
  --color-godzilla-700: #525e21;
  --color-godzilla-800: #404b00;
  --color-godzilla-900: #313909;
  --color-godzilla-950: #1e2403;
  --color-onsen: #55f6cd;
  --color-onsen-50: #d9fff2;
  --color-onsen-100: #abffe5;
  --color-onsen-200: #55f6cd;
  --color-onsen-300: #5adbb8;
  --color-onsen-400: #00bc98;
  --color-onsen-500: #009d7e;
  --color-onsen-600: #007e65;
  --color-onsen-700: #006450;
  --color-onsen-800: #004f3e;
  --color-onsen-900: #003d2f;
  --color-onsen-950: #00261d;
  --color-love-priestess: #b552c5;
  --color-love-priestess-50: #fdefff;
  --color-love-priestess-100: #fbdfff;
  --color-love-priestess-200: #f6bfff;
  --color-love-priestess-300: #ef98fd;
  --color-love-priestess-400: #d271e2;
  --color-love-priestess-500: #b552c5;
  --color-love-priestess-600: #9837a7;
  --color-love-priestess-700: #7d228b;
  --color-love-priestess-800: #651371;
  --color-love-priestess-900: #50085b;
  --color-love-priestess-950: #34023c;
  --color-sour-lime: #a8c500;
  --color-sour-lime-50: #e6faa7;
  --color-sour-lime-100: #d9f090;
  --color-sour-lime-200: #c2db67;
  --color-sour-lime-300: #a8c500;
  --color-sour-lime-400: #8da500;
  --color-sour-lime-500: #758a00;
  --color-sour-lime-600: #5f7000;
  --color-sour-lime-700: #4b5a00;
  --color-sour-lime-800: #3b4700;
  --color-sour-lime-900: #2e3800;
  --color-sour-lime-950: #1c2300;
  --color-dark-prom-queen: #311137;
  --color-dark-prom-queen-50: #fdf0ff;
  --color-dark-prom-queen-100: #fae1ff;
  --color-dark-prom-queen-200: #eaccef;
  --color-dark-prom-queen-300: #d5b3dc;
  --color-dark-prom-queen-400: #b792be;
  --color-dark-prom-queen-500: #9c77a3;
  --color-dark-prom-queen-600: #815d88;
  --color-dark-prom-queen-700: #69486f;
  --color-dark-prom-queen-800: #543759;
  --color-dark-prom-queen-900: #422a47;
  --color-dark-prom-queen-950: #311137;
}