Homeworld to Ice Temple Color Palette

About this palette

Homeworld to Ice Temple is a 5-color vibrant, light, cool, neon palette: #00A1E3 (Homeworld), #C297FF (Diva), #8AB4FF (Fly Away), #6EFB00 (Fertility Green), #24FFF1 (Ice Temple). It mixes blue, purple, green, turquoise tones and feels cool overall. The strongest text pairing is #00A1E3 on #24FFF1 with a contrast ratio of 2.31:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Homeworld	rgb(0, 161, 227)	hsl(197, 100%, 45%)
Diva	rgb(194, 151, 255)	hsl(265, 100%, 80%)
Fly Away	rgb(138, 180, 255)	hsl(218, 100%, 77%)
Fertility Green	rgb(110, 251, 0)	hsl(94, 100%, 49%)
Ice Temple	rgb(36, 255, 241)	hsl(176, 100%, 57%)

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

/* Homeworld to Ice Temple — https://swatchly.xyz/palette/00a1e3-c297ff-8ab4ff-6efb00-24fff1 */
:root {
  --homeworld: #00a1e3;
  --diva: #c297ff;
  --fly-away: #8ab4ff;
  --fertility-green: #6efb00;
  --ice-temple: #24fff1;
}

Tailwind CSS v4

/* Homeworld to Ice Temple — https://swatchly.xyz/palette/00a1e3-c297ff-8ab4ff-6efb00-24fff1 */
@theme {
  --color-homeworld: #00a1e3;
  --color-homeworld-50: #e3f4ff;
  --color-homeworld-100: #caeaff;
  --color-homeworld-200: #9ad8ff;
  --color-homeworld-300: #58c3ff;
  --color-homeworld-400: #00a1e3;
  --color-homeworld-500: #0086be;
  --color-homeworld-600: #006c9b;
  --color-homeworld-700: #00567c;
  --color-homeworld-800: #004463;
  --color-homeworld-900: #00364f;
  --color-homeworld-950: #002235;
  --color-diva: #c297ff;
  --color-diva-50: #fbf9ff;
  --color-diva-100: #f5f0ff;
  --color-diva-200: #e8daff;
  --color-diva-300: #d8c0ff;
  --color-diva-400: #c297ff;
  --color-diva-500: #a379dd;
  --color-diva-600: #865bbd;
  --color-diva-700: #6b439d;
  --color-diva-800: #54307f;
  --color-diva-900: #402164;
  --color-diva-950: #271140;
  --color-fly-away: #8ab4ff;
  --color-fly-away-50: #e6efff;
  --color-fly-away-100: #d3e3ff;
  --color-fly-away-200: #b1cdff;
  --color-fly-away-300: #8ab4ff;
  --color-fly-away-400: #6f97de;
  --color-fly-away-500: #567dc4;
  --color-fly-away-600: #4064a7;
  --color-fly-away-700: #2f508c;
  --color-fly-away-800: #223e74;
  --color-fly-away-900: #18315f;
  --color-fly-away-950: #0c1e3f;
  --color-fertility-green: #6efb00;
  --color-fertility-green-50: #dfffd4;
  --color-fertility-green-100: #beffa6;
  --color-fertility-green-200: #6efb00;
  --color-fertility-green-300: #6bdf2d;
  --color-fertility-green-400: #51bd00;
  --color-fertility-green-500: #429d00;
  --color-fertility-green-600: #347f00;
  --color-fertility-green-700: #286500;
  --color-fertility-green-800: #1e5000;
  --color-fertility-green-900: #153d00;
  --color-fertility-green-950: #0a2700;
  --color-ice-temple: #24fff1;
  --color-ice-temple-50: #ecfffd;
  --color-ice-temple-100: #c5fff8;
  --color-ice-temple-200: #24fff1;
  --color-ice-temple-300: #49e1d6;
  --color-ice-temple-400: #00bfb4;
  --color-ice-temple-500: #009f95;
  --color-ice-temple-600: #007f78;
  --color-ice-temple-700: #00645e;
  --color-ice-temple-800: #004d49;
  --color-ice-temple-900: #003c38;
  --color-ice-temple-950: #002623;
}