Start generating

Peach Fuzz to Eternal Darkness color palette

FFC1AAPeach Fuzz005566Plunge5F6BA2Twinkle NightFFF7E6Cosmic Latte00A2B8True Sky Blue212944Eternal Darkness
Open in generator Export PNG, PDF, ASE…

About this palette

Peach Fuzz to Eternal Darkness is a 6-color cool palette: #FFC1AA (Peach Fuzz), #005566 (Plunge), #5F6BA2 (Twinkle Night), #FFF7E6 (Cosmic Latte), #00A2B8 (True Sky Blue), #212944 (Eternal Darkness). It mixes orange, blue, white, turquoise tones and feels cool overall. The strongest text pairing is #FFF7E6 on #212944 with a contrast ratio of 13.44:1, and 6 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Peach Fuzzrgb(255, 193, 170)hsl(16, 100%, 83%)
Plungergb(0, 85, 102)hsl(190, 100%, 20%)
Twinkle Nightrgb(95, 107, 162)hsl(229, 26%, 50%)
Cosmic Lattergb(255, 247, 230)hsl(41, 100%, 95%)
True Sky Bluergb(0, 162, 184)hsl(187, 100%, 36%)
Eternal Darknessrgb(33, 41, 68)hsl(226, 35%, 20%)

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.

  • Aa13.44:1 Super#FFF7E6 on #212944
  • Aa13.44:1 Super#212944 on #FFF7E6
  • Aa9.19:1 Very good#FFC1AA on #212944
  • Aa9.19:1 Very good#212944 on #FFC1AA
  • Aa7.91:1 Very good#005566 on #FFF7E6
  • Aa7.91:1 Very good#FFF7E6 on #005566
  • Aa5.40:1 Good#FFC1AA on #005566
  • Aa5.40:1 Good#005566 on #FFC1AA

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Peach Fuzz to Eternal Darkness — https://swatchly.xyz/palette/ffc1aa-005566-5f6ba2-fff7e6-00a2b8-212944 */
:root {
  --peach-fuzz: #ffc1aa;
  --plunge: #005566;
  --twinkle-night: #5f6ba2;
  --cosmic-latte: #fff7e6;
  --true-sky-blue: #00a2b8;
  --eternal-darkness: #212944;
}

Tailwind CSS v4

/* Peach Fuzz to Eternal Darkness — https://swatchly.xyz/palette/ffc1aa-005566-5f6ba2-fff7e6-00a2b8-212944 */
@theme {
  --color-peach-fuzz: #ffc1aa;
  --color-peach-fuzz-50: #ffede6;
  --color-peach-fuzz-100: #ffded2;
  --color-peach-fuzz-200: #ffc1aa;
  --color-peach-fuzz-300: #e3ae9a;
  --color-peach-fuzz-400: #c78e79;
  --color-peach-fuzz-500: #ac735e;
  --color-peach-fuzz-600: #905b47;
  --color-peach-fuzz-700: #764634;
  --color-peach-fuzz-800: #603626;
  --color-peach-fuzz-900: #4b281b;
  --color-peach-fuzz-950: #31170e;
  --color-plunge: #005566;
  --color-plunge-50: #e6f9ff;
  --color-plunge-100: #cbf3ff;
  --color-plunge-200: #afe1ef;
  --color-plunge-300: #94cdde;
  --color-plunge-400: #70b0c2;
  --color-plunge-500: #5397a9;
  --color-plunge-600: #397d8f;
  --color-plunge-700: #246777;
  --color-plunge-800: #005566;
  --color-plunge-900: #08414e;
  --color-plunge-950: #012a33;
  --color-twinkle-night: #5f6ba2;
  --color-twinkle-night-50: #f2f5ff;
  --color-twinkle-night-100: #e6ebff;
  --color-twinkle-night-200: #ccd7ff;
  --color-twinkle-night-300: #b3c0f3;
  --color-twinkle-night-400: #93a0d9;
  --color-twinkle-night-500: #7885be;
  --color-twinkle-night-600: #5f6ba2;
  --color-twinkle-night-700: #4a5485;
  --color-twinkle-night-800: #38416c;
  --color-twinkle-night-900: #2a3156;
  --color-twinkle-night-950: #191e38;
  --color-cosmic-latte: #fff7e6;
  --color-cosmic-latte-50: #fff7e6;
  --color-cosmic-latte-100: #f2ede3;
  --color-cosmic-latte-200: #ded9cc;
  --color-cosmic-latte-300: #c8c1b4;
  --color-cosmic-latte-400: #a9a292;
  --color-cosmic-latte-500: #8d8677;
  --color-cosmic-latte-600: #726b5d;
  --color-cosmic-latte-700: #5b5547;
  --color-cosmic-latte-800: #474236;
  --color-cosmic-latte-900: #373229;
  --color-cosmic-latte-950: #221f18;
  --color-true-sky-blue: #00a2b8;
  --color-true-sky-blue-50: #e8fbff;
  --color-true-sky-blue-100: #d0f7ff;
  --color-true-sky-blue-200: #9cecfc;
  --color-true-sky-blue-300: #7ad9eb;
  --color-true-sky-blue-400: #47bcd1;
  --color-true-sky-blue-500: #00a2b8;
  --color-true-sky-blue-600: #008295;
  --color-true-sky-blue-700: #006776;
  --color-true-sky-blue-800: #00505c;
  --color-true-sky-blue-900: #003d47;
  --color-true-sky-blue-950: #00262c;
  --color-eternal-darkness: #212944;
  --color-eternal-darkness-50: #f1f5ff;
  --color-eternal-darkness-100: #e4ebff;
  --color-eternal-darkness-200: #ced7f1;
  --color-eternal-darkness-300: #b6c0de;
  --color-eternal-darkness-400: #949fbf;
  --color-eternal-darkness-500: #7782a2;
  --color-eternal-darkness-600: #5c6684;
  --color-eternal-darkness-700: #464e69;
  --color-eternal-darkness-800: #333a51;
  --color-eternal-darkness-900: #212944;
  --color-eternal-darkness-950: #141825;
}

Similar palettes