Pretty in Prune to Nightmare Color Palette

About this palette

Pretty in Prune to Nightmare is a 5-color cool palette: #662462 (Pretty in Prune), #83FFF3 (Glitter Shower), #ADBA2B (Lush Bamboo), #AC2BBA (Magentleman), #171C00 (Nightmare). It mixes purple, turquoise, green, pink tones and feels cool overall. The strongest text pairing is #83FFF3 on #171C00 with a contrast ratio of 14.61:1, and 5 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Pretty in Prune	rgb(102, 36, 98)	hsl(304, 48%, 27%)
Glitter Shower	rgb(131, 255, 243)	hsl(174, 100%, 76%)
Lush Bamboo	rgb(173, 186, 43)	hsl(65, 62%, 45%)
Magentleman	rgb(172, 43, 186)	hsl(294, 62%, 45%)
Nightmare	rgb(23, 28, 0)	hsl(71, 100%, 5%)

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.

Aa14.61:1 Super#83FFF3 on #171C00
Aa14.61:1 Super#171C00 on #83FFF3
Aa8.81:1 Very good#662462 on #83FFF3
Aa8.81:1 Very good#83FFF3 on #662462
Aa8.18:1 Very good#ADBA2B on #171C00
Aa8.18:1 Very good#171C00 on #ADBA2B
Aa4.93:1 Good#662462 on #ADBA2B
Aa4.93:1 Good#ADBA2B on #662462

Color blindness preview

CSS variables

/* Pretty in Prune to Nightmare — https://swatchly.xyz/palette/662462-83fff3-adba2b-ac2bba-171c00 */
:root {
  --pretty-in-prune: #662462;
  --glitter-shower: #83fff3;
  --lush-bamboo: #adba2b;
  --magentleman: #ac2bba;
  --nightmare: #171c00;
}

Tailwind CSS v4

/* Pretty in Prune to Nightmare — https://swatchly.xyz/palette/662462-83fff3-adba2b-ac2bba-171c00 */
@theme {
  --color-pretty-in-prune: #662462;
  --color-pretty-in-prune-50: #fff0fd;
  --color-pretty-in-prune-100: #ffe0fb;
  --color-pretty-in-prune-200: #fbc2f5;
  --color-pretty-in-prune-300: #e9a8e2;
  --color-pretty-in-prune-400: #cc86c5;
  --color-pretty-in-prune-500: #b069aa;
  --color-pretty-in-prune-600: #934f8e;
  --color-pretty-in-prune-700: #793b74;
  --color-pretty-in-prune-800: #662462;
  --color-pretty-in-prune-900: #4d1f4a;
  --color-pretty-in-prune-950: #321030;
  --color-glitter-shower: #83fff3;
  --color-glitter-shower-50: #c3fff8;
  --color-glitter-shower-100: #83fff3;
  --color-glitter-shower-200: #8ee6dd;
  --color-glitter-shower-300: #6bd2c8;
  --color-glitter-shower-400: #35b5ab;
  --color-glitter-shower-500: #009990;
  --color-glitter-shower-600: #007c74;
  --color-glitter-shower-700: #00635d;
  --color-glitter-shower-800: #004d48;
  --color-glitter-shower-900: #003c38;
  --color-glitter-shower-950: #002623;
  --color-lush-bamboo: #adba2b;
  --color-lush-bamboo-50: #f8ffd6;
  --color-lush-bamboo-100: #f0fab5;
  --color-lush-bamboo-200: #dfea96;
  --color-lush-bamboo-300: #cad672;
  --color-lush-bamboo-400: #adba2b;
  --color-lush-bamboo-500: #8f9b00;
  --color-lush-bamboo-600: #737c00;
  --color-lush-bamboo-700: #5a6200;
  --color-lush-bamboo-800: #454b00;
  --color-lush-bamboo-900: #343900;
  --color-lush-bamboo-950: #1f2200;
  --color-magentleman: #ac2bba;
  --color-magentleman-50: #fef0ff;
  --color-magentleman-100: #fde2ff;
  --color-magentleman-200: #fac4ff;
  --color-magentleman-300: #f69eff;
  --color-magentleman-400: #e46df1;
  --color-magentleman-500: #c94cd7;
  --color-magentleman-600: #ac2bba;
  --color-magentleman-700: #8e0c9b;
  --color-magentleman-800: #71007c;
  --color-magentleman-900: #580061;
  --color-magentleman-950: #39003f;
  --color-nightmare: #171c00;
  --color-nightmare-50: #f3f8e4;
  --color-nightmare-100: #e9eed8;
  --color-nightmare-200: #d5dbc0;
  --color-nightmare-300: #bec5a7;
  --color-nightmare-400: #9ea684;
  --color-nightmare-500: #818967;
  --color-nightmare-600: #666d4d;
  --color-nightmare-700: #4f5538;
  --color-nightmare-800: #3b4128;
  --color-nightmare-900: #2b301c;
  --color-nightmare-950: #171c00;
}