Night Fever to Go Go Green color palette

522F80Night Fever 00F2EACold Light of Day A384EBPerrywinkle 321C00Close but No Cigar 008A7EGo Go Green

Open in generator Export PNG, PDF, ASE…

About this palette

Night Fever to Go Go Green is a 5-color cool palette: #522F80 (Night Fever), #00F2EA (Cold Light of Day), #A384EB (Perrywinkle), #321C00 (Close but No Cigar), #008A7E (Go Go Green). It mixes purple, turquoise, brown tones and feels cool overall. The strongest text pairing is #00F2EA on #321C00 with a contrast ratio of 11.44:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Night Fever	rgb(82, 47, 128)	hsl(266, 46%, 34%)
Cold Light of Day	rgb(0, 242, 234)	hsl(178, 100%, 47%)
Perrywinkle	rgb(163, 132, 235)	hsl(258, 72%, 72%)
Close but No Cigar	rgb(50, 28, 0)	hsl(34, 100%, 10%)
Go Go Green	rgb(0, 138, 126)	hsl(175, 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.

Aa11.44:1 Very good#00F2EA on #321C00
Aa11.44:1 Very good#321C00 on #00F2EA
Aa7.17:1 Very good#522F80 on #00F2EA
Aa7.17:1 Very good#00F2EA on #522F80
Aa5.42:1 Good#A384EB on #321C00
Aa5.42:1 Good#321C00 on #A384EB
Aa3.79:1 Poor#321C00 on #008A7E
Aa3.79:1 Poor#008A7E on #321C00

Color blindness preview

CSS variables

/* Night Fever to Go Go Green — https://swatchly.xyz/palette/522f80-00f2ea-a384eb-321c00-008a7e */
:root {
  --night-fever: #522f80;
  --cold-light-of-day: #00f2ea;
  --perrywinkle: #a384eb;
  --close-but-no-cigar: #321c00;
  --go-go-green: #008a7e;
}

Tailwind CSS v4

/* Night Fever to Go Go Green — https://swatchly.xyz/palette/522f80-00f2ea-a384eb-321c00-008a7e */
@theme {
  --color-night-fever: #522f80;
  --color-night-fever-50: #f7f3ff;
  --color-night-fever-100: #eee7ff;
  --color-night-fever-200: #deceff;
  --color-night-fever-300: #cdb1ff;
  --color-night-fever-400: #af90e5;
  --color-night-fever-500: #9574cb;
  --color-night-fever-600: #7b5aad;
  --color-night-fever-700: #644591;
  --color-night-fever-800: #522f80;
  --color-night-fever-900: #3e2660;
  --color-night-fever-950: #281640;
  --color-cold-light-of-day: #00f2ea;
  --color-cold-light-of-day-50: #c8fffb;
  --color-cold-light-of-day-100: #97fdf6;
  --color-cold-light-of-day-200: #00f2ea;
  --color-cold-light-of-day-300: #2fd8d1;
  --color-cold-light-of-day-400: #00b6b0;
  --color-cold-light-of-day-500: #009893;
  --color-cold-light-of-day-600: #007b77;
  --color-cold-light-of-day-700: #00625f;
  --color-cold-light-of-day-800: #004d4a;
  --color-cold-light-of-day-900: #003c39;
  --color-cold-light-of-day-950: #002524;
  --color-perrywinkle: #a384eb;
  --color-perrywinkle-50: #f3f0ff;
  --color-perrywinkle-100: #e9e2ff;
  --color-perrywinkle-200: #d6c9ff;
  --color-perrywinkle-300: #c1aaff;
  --color-perrywinkle-400: #a384eb;
  --color-perrywinkle-500: #896ace;
  --color-perrywinkle-600: #7051b0;
  --color-perrywinkle-700: #5a3d93;
  --color-perrywinkle-800: #482d79;
  --color-perrywinkle-900: #382162;
  --color-perrywinkle-950: #241342;
  --color-close-but-no-cigar: #321c00;
  --color-close-but-no-cigar-50: #fff3e6;
  --color-close-but-no-cigar-100: #fae8d4;
  --color-close-but-no-cigar-200: #e9d3bc;
  --color-close-but-no-cigar-300: #d5bca1;
  --color-close-but-no-cigar-400: #b79c7f;
  --color-close-but-no-cigar-500: #9c8163;
  --color-close-but-no-cigar-600: #81674b;
  --color-close-but-no-cigar-700: #695237;
  --color-close-but-no-cigar-800: #544028;
  --color-close-but-no-cigar-900: #43311d;
  --color-close-but-no-cigar-950: #321c00;
  --color-go-go-green: #008a7e;
  --color-go-go-green-50: #d7fff8;
  --color-go-go-green-100: #c0fbf2;
  --color-go-go-green-200: #a5ece1;
  --color-go-go-green-300: #86d9cd;
  --color-go-go-green-400: #5bbdb0;
  --color-go-go-green-500: #35a497;
  --color-go-go-green-600: #008a7e;
  --color-go-go-green-700: #006e64;
  --color-go-go-green-800: #00564e;
  --color-go-go-green-900: #00423b;
  --color-go-go-green-950: #002925;
}