Palette

Glacier Canyon Ice

Crisp and clear blues, reflecting sunlight on ancient glacial ice and deep, cold canyon rivers.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Glacier Canyon Ice 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 Glacier Canyon Ice.

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

Data visualization

#E0FFFF#ADD8E6#87CEEB#4682B4#104C74

Palette guide

How to use Glacier Canyon Ice

Overview

The Glacier Canyon Ice palette is a powerful and crisp collection of blues, designed to evoke the dramatic beauty of sunlight on ancient glacial ice and deep canyon rivers. It spans from the ethereal brightness of #E0FFFF to the profound depth of #104C74, offering a strong visual narrative. Intermediate shades like #ADD8E6, #87CEEB, and #4682B4 provide a smooth transition, creating a sense of natural depth and dimension. This palette is excellent for designers and developers aiming to create robust, clean, and professional designs that convey strength, clarity, and a touch of rugged natural beauty.

Best used for

Outdoor adventure or travel brands
Corporate websites needing a serious, clean look
Scientific or engineering firm branding
Winter sports apparel or equipment
Data dashboards requiring clear visual hierarchy
Minimalist product design

Suggested color roles

primary

#104C74 (Dark Blue) - Ideal for main navigation, footers, or prominent brand elements, providing a strong, authoritative foundation.

secondary

#4682B4 (Steel Blue) - Suited for sub-sections, secondary buttons, or background panels that require a solid yet less dominant presence.

accent

#87CEEB (Sky Blue) - Use for interactive elements, calls to action, or key highlights to draw attention with a clear, refreshing pop.

background

#E0FFFF (Light Cyan) - A bright, expansive background color that ensures maximum readability and a clean, professional aesthetic.

text

For main body text, a dark charcoal like #222222 on #E0FFFF is highly readable. For headings, #104C74 provides strong impact.

Accessibility notes

#104C74 and #4682B4 offer excellent contrast against #E0FFFF for all text sizes.
#87CEEB generally provides good contrast for larger text on #E0FFFF, but check for small text.
Avoid using #ADD8E6 as text on #E0FFFF; contrast will be insufficient for readability.
Ensure interactive elements are clearly distinguishable, especially if using similar light blues.

Recommended combinations

Arctic Interface

A clean, functional UI with a bright background, subtle card elements, and a deep, commanding color for primary actions.

#E0FFFF · #ADD8E6 · #104C74

Depth & Light

Create visual depth in layouts, using the dark blue for a base, mid-blue for content, and light blue for highlights.

#4682B4 · #87CEEB · #E0FFFF

Canyon Layers

Apply these colors in a gradient or layered design to mimic the natural strata of a canyon, from deep to light.

#104C74 · #4682B4 · #87CEEB

CSS variables

:root {
  --glacier-canyon-ice-1: #E0FFFF;
  --glacier-canyon-ice-2: #ADD8E6;
  --glacier-canyon-ice-3: #87CEEB;
  --glacier-canyon-ice-4: #4682B4;
  --glacier-canyon-ice-5: #104C74;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glacier-canyon-ice": {
        1: "#E0FFFF",
        2: "#ADD8E6",
        3: "#87CEEB",
        4: "#4682B4",
        5: "#104C74",
      }
    }
  }
}

Hex values

Color 1#E0FFFF

Color 2#ADD8E6

Color 3#87CEEB

Color 4#4682B4

Color 5#104C74

Accessibility

Contrast checker

1.4:1Fail

1.7:1Fail

3.9:1AA18

8.6:1AAA

1.4:1Fail

1.1:1Fail

2.7:1Fail

6:1AA

1.7:1Fail

1.1:1Fail

2.4:1Fail

5.2:1AA

3.9:1AA18

2.7:1Fail

2.4:1Fail

2.2:1Fail

8.6:1AAA

6:1AA

5.2:1AA

2.2:1Fail

Similar palettes

More like Glacier Canyon Ice

Alpine Frost Serenity

Arctic Glacier Chill