Start generating

Breaking the Ice to Blood of Zeus color palette

B6EDFFBreaking the IceFDA287Creamy Peach00A0BFBlue OceanBA6A3DOak Palace00576FSea Creature611705Blood of Zeus
Open in generator Export PNG, PDF, ASE…

About this palette

Breaking the Ice to Blood of Zeus is a 6-color palette: #B6EDFF (Breaking the Ice), #FDA287 (Creamy Peach), #00A0BF (Blue Ocean), #BA6A3D (Oak Palace), #00576F (Sea Creature), #611705 (Blood of Zeus). It mixes blue, pink, orange, brown tones and feels balanced overall. The strongest text pairing is #B6EDFF on #611705 with a contrast ratio of 10.13:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Breaking the Icergb(182, 237, 255)hsl(195, 100%, 86%)
Creamy Peachrgb(253, 162, 135)hsl(14, 97%, 76%)
Blue Oceanrgb(0, 160, 191)hsl(190, 100%, 37%)
Oak Palacergb(186, 106, 61)hsl(22, 51%, 48%)
Sea Creaturergb(0, 87, 111)hsl(193, 100%, 22%)
Blood of Zeusrgb(97, 23, 5)hsl(12, 90%, 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.

  • Aa10.13:1 Very good#B6EDFF on #611705
  • Aa10.13:1 Very good#611705 on #B6EDFF
  • Aa6.55:1 Good#FDA287 on #611705
  • Aa6.55:1 Good#611705 on #FDA287
  • Aa6.38:1 Good#B6EDFF on #00576F
  • Aa6.38:1 Good#00576F on #B6EDFF
  • Aa4.15:1 Poor#00A0BF on #611705
  • Aa4.15:1 Poor#611705 on #00A0BF

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Breaking the Ice to Blood of Zeus — https://swatchly.xyz/palette/b6edff-fda287-00a0bf-ba6a3d-00576f-611705 */
:root {
  --breaking-the-ice: #b6edff;
  --creamy-peach: #fda287;
  --blue-ocean: #00a0bf;
  --oak-palace: #ba6a3d;
  --sea-creature: #00576f;
  --blood-of-zeus: #611705;
}

Tailwind CSS v4

/* Breaking the Ice to Blood of Zeus — https://swatchly.xyz/palette/b6edff-fda287-00a0bf-ba6a3d-00576f-611705 */
@theme {
  --color-breaking-the-ice: #b6edff;
  --color-breaking-the-ice-50: #d4f4ff;
  --color-breaking-the-ice-100: #b6edff;
  --color-breaking-the-ice-200: #afd8e6;
  --color-breaking-the-ice-300: #96c4d3;
  --color-breaking-the-ice-400: #74a7b7;
  --color-breaking-the-ice-500: #588d9d;
  --color-breaking-the-ice-600: #407383;
  --color-breaking-the-ice-700: #2d5d6b;
  --color-breaking-the-ice-800: #1e4955;
  --color-breaking-the-ice-900: #143843;
  --color-breaking-the-ice-950: #09232b;
  --color-creamy-peach: #fda287;
  --color-creamy-peach-50: #ffefea;
  --color-creamy-peach-100: #ffe1d8;
  --color-creamy-peach-200: #ffc4b3;
  --color-creamy-peach-300: #fda287;
  --color-creamy-peach-400: #da856b;
  --color-creamy-peach-500: #be6950;
  --color-creamy-peach-600: #a04f38;
  --color-creamy-peach-700: #843b25;
  --color-creamy-peach-800: #6b2b18;
  --color-creamy-peach-900: #561f0f;
  --color-creamy-peach-950: #381106;
  --color-blue-ocean: #00a0bf;
  --color-blue-ocean-50: #eafaff;
  --color-blue-ocean-100: #d5f5ff;
  --color-blue-ocean-200: #a1eaff;
  --color-blue-ocean-300: #79d7f2;
  --color-blue-ocean-400: #47bad8;
  --color-blue-ocean-500: #00a0bf;
  --color-blue-ocean-600: #00819a;
  --color-blue-ocean-700: #00667b;
  --color-blue-ocean-800: #004f60;
  --color-blue-ocean-900: #003c4a;
  --color-blue-ocean-950: #00252f;
  --color-oak-palace: #ba6a3d;
  --color-oak-palace-50: #fff1ea;
  --color-oak-palace-100: #ffe3d5;
  --color-oak-palace-200: #ffc7aa;
  --color-oak-palace-300: #f4aa83;
  --color-oak-palace-400: #d7875c;
  --color-oak-palace-500: #ba6a3d;
  --color-oak-palace-600: #9c5124;
  --color-oak-palace-700: #813d10;
  --color-oak-palace-800: #682d03;
  --color-oak-palace-900: #532100;
  --color-oak-palace-950: #361300;
  --color-sea-creature: #00576f;
  --color-sea-creature-50: #e8f8ff;
  --color-sea-creature-100: #d1f1ff;
  --color-sea-creature-200: #acdff4;
  --color-sea-creature-300: #8dc8e0;
  --color-sea-creature-400: #65a8c2;
  --color-sea-creature-500: #468ba5;
  --color-sea-creature-600: #2a6f87;
  --color-sea-creature-700: #00576f;
  --color-sea-creature-800: #064456;
  --color-sea-creature-900: #013444;
  --color-sea-creature-950: #00202b;
  --color-blood-of-zeus: #611705;
  --color-blood-of-zeus-50: #fff2ee;
  --color-blood-of-zeus-100: #ffe4de;
  --color-blood-of-zeus-200: #ffc9bb;
  --color-blood-of-zeus-300: #f7ab99;
  --color-blood-of-zeus-400: #db8975;
  --color-blood-of-zeus-500: #bf6d59;
  --color-blood-of-zeus-600: #a25341;
  --color-blood-of-zeus-700: #863f2e;
  --color-blood-of-zeus-800: #6d2f20;
  --color-blood-of-zeus-900: #611705;
  --color-blood-of-zeus-950: #3a130a;
}

Similar palettes