Palette

Glacial Ice Peaks

The crisp, clear blues and whites of ancient glacial ice formations under a bright sky.

PastelCalm5 colors

More Pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Glacial Ice Peaks reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Glacial Ice Peaks.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#ADD8E6#B0E0E6#AFEEEE#E0FFFF#F0FFFF

Palette guide

How to use Glacial Ice Peaks

Overview

The Glacial Ice Peaks palette offers a refreshing collection of crisp, light blues and whites, echoing ancient ice formations under a bright sky. This serene palette, ranging from the gentle #ADD8E6 to the ethereal #F0FFFF, is perfect for designs seeking a calm, airy, and pristine aesthetic. Designers can leverage the slightly deeper #ADD8E6 as a primary cool tone, while #E0FFFF and #F0FFFF provide luminous backgrounds. The consistent cool undertone across #B0E0E6 and #AFEEEE ensures a harmonious flow, making it ideal for creating light, spacious, and inviting digital or print experiences that evoke purity and tranquility.

Best used for

Spa and wellness websites
Baby product branding
Cloud computing interfaces
Clean, minimalist web design
Winter-themed event invitations
Serene interior decor concepts

Suggested color roles

primary

#ADD8E6 - This gentle blue serves as a calming primary color for headers, larger graphical elements, or section backgrounds.

secondary

#B0E0E6 - A slightly softer blue, useful for secondary navigation, subtle borders, or to add a touch of color to light backgrounds.

accent

#AFEEEE - This aqua-like shade can be used for delicate highlights, interactive element hover states, or small icons, adding a fresh sparkle.

background

#F0FFFF - An ethereal, almost white hue, perfect for expansive main content areas, providing a bright, clean, and airy canvas.

text

#ADD8E6 - Use this color for larger display text on #F0FFFF, or for body text, consider a very dark grey or charcoal for better accessibility on light backgrounds.

Accessibility notes

Most colors are very light; ensure high contrast for text by pairing with a dark grey or black.
Avoid using light blue text (e.g., #AFEEEE) on very light backgrounds (e.g., #F0FFFF) as it will lack sufficient contrast.
Use #ADD8E6 for larger headings or graphical elements, but not for small body text.
When using these light tones, ensure interactive elements have clear visual cues beyond color, such as underlines or icons.

Recommended combinations

Airy Foundation

Creates a very light background with a gentle, cool accent for headings or primary elements.

#F0FFFF · #ADD8E6 · #B0E0E6

Soft Gradient

Ideal for subtle background gradients or layered elements that require a smooth transition of cool tones.

#E0FFFF · #AFEEEE · #B0E0E6

Pristine Highlight

Use #ADD8E6 as a header or feature color on #F0FFFF, with black for body text for optimal readability.

#ADD8E6 · #F0FFFF · #AFEEEE

CSS variables

:root {
  --glacial-ice-peaks-3-1: #ADD8E6;
  --glacial-ice-peaks-3-2: #B0E0E6;
  --glacial-ice-peaks-3-3: #AFEEEE;
  --glacial-ice-peaks-3-4: #E0FFFF;
  --glacial-ice-peaks-3-5: #F0FFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glacial-ice-peaks-3": {
        1: "#ADD8E6",
        2: "#B0E0E6",
        3: "#AFEEEE",
        4: "#E0FFFF",
        5: "#F0FFFF",
      }
    }
  }
}

Hex values

Color 1#ADD8E6

Color 2#B0E0E6

Color 3#AFEEEE

Color 4#E0FFFF

Color 5#F0FFFF

Accessibility

Contrast checker

1.1:1Fail

1.2:1Fail

1.4:1Fail

1.5:1Fail

1.1:1Fail

1.4:1Fail

1.2:1Fail

1.1:1Fail

1.2:1Fail

1.3:1Fail

1.4:1Fail

1.2:1Fail

1:1Fail

1.5:1Fail

1.4:1Fail

1.3:1Fail

1:1Fail

Similar palettes

More like Glacial Ice Peaks

Glacial Ice Peaks

See it in context.

Ready when you are.

Built with Glacial Ice Peaks.

How to use Glacial Ice Peaks

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Airy Foundation

Soft Gradient

Pristine Highlight

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Glacial Ice Peaks