Ferocious Fuchsia to Sky Color Palette

About this palette

Ferocious Fuchsia to Sky is a 4-color vibrant, neon palette: #A800C3 (Ferocious Fuchsia), #D16100 (Solar Ash), #CC8E00 (End of Summer), #68D5FF (Sky). It mixes purple, orange, yellow, blue tones and feels balanced overall. The strongest text pairing is #A800C3 on #68D5FF with a contrast ratio of 3.63:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Ferocious Fuchsia	rgb(168, 0, 195)	hsl(292, 100%, 38%)
Solar Ash	rgb(209, 97, 0)	hsl(28, 100%, 41%)
End of Summer	rgb(204, 142, 0)	hsl(42, 100%, 40%)
Sky	rgb(104, 213, 255)	hsl(197, 100%, 70%)

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.

Aa3.63:1 Poor#A800C3 on #68D5FF
Aa3.63:1 Poor#68D5FF on #A800C3

Color blindness preview

CSS variables

/* Ferocious Fuchsia to Sky — https://swatchly.xyz/palette/a800c3-d16100-cc8e00-68d5ff */
:root {
  --ferocious-fuchsia: #a800c3;
  --solar-ash: #d16100;
  --end-of-summer: #cc8e00;
  --sky: #68d5ff;
}

Tailwind CSS v4

/* Ferocious Fuchsia to Sky — https://swatchly.xyz/palette/a800c3-d16100-cc8e00-68d5ff */
@theme {
  --color-ferocious-fuchsia: #a800c3;
  --color-ferocious-fuchsia-50: #fdf0ff;
  --color-ferocious-fuchsia-100: #fae2ff;
  --color-ferocious-fuchsia-200: #f5c3ff;
  --color-ferocious-fuchsia-300: #ee9eff;
  --color-ferocious-fuchsia-400: #e25ffd;
  --color-ferocious-fuchsia-500: #c639e1;
  --color-ferocious-fuchsia-600: #a800c3;
  --color-ferocious-fuchsia-700: #86009c;
  --color-ferocious-fuchsia-800: #6a007c;
  --color-ferocious-fuchsia-900: #530061;
  --color-ferocious-fuchsia-950: #360040;
  --color-solar-ash: #d16100;
  --color-solar-ash-50: #fff2eb;
  --color-solar-ash-100: #ffe5d8;
  --color-solar-ash-200: #ffcbae;
  --color-solar-ash-300: #ffa979;
  --color-solar-ash-400: #ee7f3a;
  --color-solar-ash-500: #d16100;
  --color-solar-ash-600: #a94d00;
  --color-solar-ash-700: #873c00;
  --color-solar-ash-800: #6b2e00;
  --color-solar-ash-900: #542200;
  --color-solar-ash-950: #361400;
  --color-end-of-summer: #cc8e00;
  --color-end-of-summer-50: #fff1dc;
  --color-end-of-summer-100: #ffe4bb;
  --color-end-of-summer-200: #fbca7d;
  --color-end-of-summer-300: #e8b155;
  --color-end-of-summer-400: #cc8e00;
  --color-end-of-summer-500: #aa7600;
  --color-end-of-summer-600: #8a5f00;
  --color-end-of-summer-700: #6e4b00;
  --color-end-of-summer-800: #573a00;
  --color-end-of-summer-900: #442d00;
  --color-end-of-summer-950: #2c1c00;
  --color-sky: #68d5ff;
  --color-sky-50: #eefaff;
  --color-sky-100: #d9f3ff;
  --color-sky-200: #aae6ff;
  --color-sky-300: #68d5ff;
  --color-sky-400: #4bb3da;
  --color-sky-500: #1997be;
  --color-sky-600: #00799b;
  --color-sky-700: #00607c;
  --color-sky-800: #004a61;
  --color-sky-900: #00394b;
  --color-sky-950: #002330;
}