Nervous Neon Pink to Sparky Blue color palette

FF6ED0Nervous Neon Pink D5FA00Liquid Lime B177FFIllicit Purple 6BE000King Lizard 54EFFFSparky Blue

About this palette

Nervous Neon Pink to Sparky Blue is a 5-color vibrant, light, cool, neon palette: #FF6ED0 (Nervous Neon Pink), #D5FA00 (Liquid Lime), #B177FF (Illicit Purple), #6BE000 (King Lizard), #54EFFF (Sparky Blue). It mixes pink, green, purple, turquoise tones and feels cool overall. The strongest text pairing is #D5FA00 on #B177FF with a contrast ratio of 2.52:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Nervous Neon Pink	rgb(255, 110, 208)	hsl(319, 100%, 72%)
Liquid Lime	rgb(213, 250, 0)	hsl(69, 100%, 49%)
Illicit Purple	rgb(177, 119, 255)	hsl(266, 100%, 73%)
King Lizard	rgb(107, 224, 0)	hsl(91, 100%, 44%)
Sparky Blue	rgb(84, 239, 255)	hsl(186, 100%, 66%)

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

/* Nervous Neon Pink to Sparky Blue — https://swatchly.xyz/palette/ff6ed0-d5fa00-b177ff-6be000-54efff */
:root {
  --nervous-neon-pink: #ff6ed0;
  --liquid-lime: #d5fa00;
  --illicit-purple: #b177ff;
  --king-lizard: #6be000;
  --sparky-blue: #54efff;
}

Tailwind CSS v4

/* Nervous Neon Pink to Sparky Blue — https://swatchly.xyz/palette/ff6ed0-d5fa00-b177ff-6be000-54efff */
@theme {
  --color-nervous-neon-pink: #ff6ed0;
  --color-nervous-neon-pink-50: #fff6fb;
  --color-nervous-neon-pink-100: #ffeaf6;
  --color-nervous-neon-pink-200: #ffceeb;
  --color-nervous-neon-pink-300: #ffabe0;
  --color-nervous-neon-pink-400: #ff6ed0;
  --color-nervous-neon-pink-500: #dd4fb1;
  --color-nervous-neon-pink-600: #bb2d93;
  --color-nervous-neon-pink-700: #9b0d77;
  --color-nervous-neon-pink-800: #7b005e;
  --color-nervous-neon-pink-900: #5f0048;
  --color-nervous-neon-pink-950: #3c002d;
  --color-liquid-lime: #d5fa00;
  --color-liquid-lime-50: #e6fe9b;
  --color-liquid-lime-100: #d5fa00;
  --color-liquid-lime-200: #c6e357;
  --color-liquid-lime-300: #afce00;
  --color-liquid-lime-400: #93ad00;
  --color-liquid-lime-500: #7a9000;
  --color-liquid-lime-600: #627500;
  --color-liquid-lime-700: #4e5d00;
  --color-liquid-lime-800: #3d4900;
  --color-liquid-lime-900: #2e3800;
  --color-liquid-lime-950: #1c2300;
  --color-illicit-purple: #b177ff;
  --color-illicit-purple-50: #f5f0ff;
  --color-illicit-purple-100: #ece2ff;
  --color-illicit-purple-200: #dbc7ff;
  --color-illicit-purple-300: #c9a8ff;
  --color-illicit-purple-400: #b177ff;
  --color-illicit-purple-500: #975be1;
  --color-illicit-purple-600: #7d41c2;
  --color-illicit-purple-700: #652da3;
  --color-illicit-purple-800: #511d87;
  --color-illicit-purple-900: #40126d;
  --color-illicit-purple-950: #2a074a;
  --color-king-lizard: #6be000;
  --color-king-lizard-50: #e1ffd5;
  --color-king-lizard-100: #c1ffa6;
  --color-king-lizard-200: #9cf173;
  --color-king-lizard-300: #6be000;
  --color-king-lizard-400: #59bc00;
  --color-king-lizard-500: #499d00;
  --color-king-lizard-600: #397e00;
  --color-king-lizard-700: #2c6400;
  --color-king-lizard-800: #214f00;
  --color-king-lizard-900: #183d00;
  --color-king-lizard-950: #0c2600;
  --color-sparky-blue: #54efff;
  --color-sparky-blue-50: #ddfcff;
  --color-sparky-blue-100: #b8f8ff;
  --color-sparky-blue-200: #54efff;
  --color-sparky-blue-300: #59d5e2;
  --color-sparky-blue-400: #00b6c5;
  --color-sparky-blue-500: #0098a4;
  --color-sparky-blue-600: #007a84;
  --color-sparky-blue-700: #006169;
  --color-sparky-blue-800: #004c53;
  --color-sparky-blue-900: #003b40;
  --color-sparky-blue-950: #002529;
}