Such a Peach to Candy Grape Fizz color palette

FFDAACSuch a Peach 724D00Coffee Adept 003E5BManiac Mansion 58B7F9Hello Summer 7F4AF7Candy Grape Fizz

Open in generator Export PNG, PDF, ASE…

About this palette

Such a Peach to Candy Grape Fizz is a 5-color cool, neon palette: #FFDAAC (Such a Peach), #724D00 (Coffee Adept), #003E5B (Maniac Mansion), #58B7F9 (Hello Summer), #7F4AF7 (Candy Grape Fizz). It mixes orange, brown, blue, purple tones and feels cool overall. The strongest text pairing is #FFDAAC on #003E5B with a contrast ratio of 8.63:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Such a Peach	rgb(255, 218, 172)	hsl(33, 100%, 84%)
Coffee Adept	rgb(114, 77, 0)	hsl(41, 100%, 22%)
Maniac Mansion	rgb(0, 62, 91)	hsl(199, 100%, 18%)
Hello Summer	rgb(88, 183, 249)	hsl(205, 93%, 66%)
Candy Grape Fizz	rgb(127, 74, 247)	hsl(258, 92%, 63%)

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.

Aa8.63:1 Very good#FFDAAC on #003E5B
Aa8.63:1 Very good#003E5B on #FFDAAC
Aa5.72:1 Good#FFDAAC on #724D00
Aa5.72:1 Good#724D00 on #FFDAAC
Aa5.19:1 Good#003E5B on #58B7F9
Aa5.19:1 Good#58B7F9 on #003E5B
Aa3.76:1 Poor#FFDAAC on #7F4AF7
Aa3.76:1 Poor#7F4AF7 on #FFDAAC

Color blindness preview

CSS variables

/* Such a Peach to Candy Grape Fizz — https://swatchly.xyz/palette/ffdaac-724d00-003e5b-58b7f9-7f4af7 */
:root {
  --such-a-peach: #ffdaac;
  --coffee-adept: #724d00;
  --maniac-mansion: #003e5b;
  --hello-summer: #58b7f9;
  --candy-grape-fizz: #7f4af7;
}

Tailwind CSS v4

/* Such a Peach to Candy Grape Fizz — https://swatchly.xyz/palette/ffdaac-724d00-003e5b-58b7f9-7f4af7 */
@theme {
  --color-such-a-peach: #ffdaac;
  --color-such-a-peach-50: #fffbf5;
  --color-such-a-peach-100: #fff1df;
  --color-such-a-peach-200: #ffdaac;
  --color-such-a-peach-300: #e1c39e;
  --color-such-a-peach-400: #c2a177;
  --color-such-a-peach-500: #a58459;
  --color-such-a-peach-600: #88683e;
  --color-such-a-peach-700: #6e5029;
  --color-such-a-peach-800: #563d1a;
  --color-such-a-peach-900: #432e10;
  --color-such-a-peach-950: #2b1c07;
  --color-coffee-adept: #724d00;
  --color-coffee-adept-50: #fff3e3;
  --color-coffee-adept-100: #ffe8c6;
  --color-coffee-adept-200: #f2d2a4;
  --color-coffee-adept-300: #debb86;
  --color-coffee-adept-400: #c19a5f;
  --color-coffee-adept-500: #a67e40;
  --color-coffee-adept-600: #8a6425;
  --color-coffee-adept-700: #724d00;
  --color-coffee-adept-800: #593c01;
  --color-coffee-adept-900: #462d00;
  --color-coffee-adept-950: #2c1b00;
  --color-maniac-mansion: #003e5b;
  --color-maniac-mansion-50: #ebf7ff;
  --color-maniac-mansion-100: #d7efff;
  --color-maniac-mansion-200: #b6def8;
  --color-maniac-mansion-300: #9ac8e6;
  --color-maniac-mansion-400: #77aaca;
  --color-maniac-mansion-500: #5b90b1;
  --color-maniac-mansion-600: #427695;
  --color-maniac-mansion-700: #2f607d;
  --color-maniac-mansion-800: #204d67;
  --color-maniac-mansion-900: #003e5b;
  --color-maniac-mansion-950: #092738;
  --color-hello-summer: #58b7f9;
  --color-hello-summer-50: #f5faff;
  --color-hello-summer-100: #e6f4ff;
  --color-hello-summer-200: #c4e5ff;
  --color-hello-summer-300: #99d3ff;
  --color-hello-summer-400: #58b7f9;
  --color-hello-summer-500: #3798d8;
  --color-hello-summer-600: #057ab8;
  --color-hello-summer-700: #006093;
  --color-hello-summer-800: #004a73;
  --color-hello-summer-900: #003858;
  --color-hello-summer-950: #002238;
  --color-candy-grape-fizz: #7f4af7;
  --color-candy-grape-fizz-50: #f5f4ff;
  --color-candy-grape-fizz-100: #edebff;
  --color-candy-grape-fizz-200: #dbd6ff;
  --color-candy-grape-fizz-300: #c7beff;
  --color-candy-grape-fizz-400: #ab98ff;
  --color-candy-grape-fizz-500: #9473ff;
  --color-candy-grape-fizz-600: #7f4af7;
  --color-candy-grape-fizz-700: #672ed3;
  --color-candy-grape-fizz-800: #5217b0;
  --color-candy-grape-fizz-900: #3f058e;
  --color-candy-grape-fizz-950: #280060;
}