Back to palettes

Palette

Nordic Glacier Calm

Icy blues and whites reflecting the tranquil and majestic beauty of northern glaciers.

coolminimal5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Nordic Glacier Calm 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 Nordic Glacier Calm.

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

Data visualization

#A2D2FF#BBE0E7#DEEDF0#87CEEB#5CACEE

Palette guide

How to use Nordic Glacier Calm

Overview

The Nordic Glacier Calm palette captures the serene and majestic beauty of northern glaciers with its icy blues and soft whites. This cool collection features a vibrant sky blue, #A2D2FF, complemented by a delicate light teal, #BBE0E7. A very pale, almost white, #DEEDF0, offers a frosty touch, while the slightly deeper #87CEEB provides a balanced mid-tone. The palette is anchored by a rich, medium blue, #5CACEE. Designers can use these hues to evoke feelings of tranquility, cleanliness, and spaciousness, ideal for health, wellness, or technology-focused projects.

Best used for

  • Wellness and spa branding
  • Medical and healthcare interfaces
  • Tech product design and websites
  • Nature-inspired digital art and illustrations
  • Children's educational apps (with careful contrast)
  • Environmental awareness campaigns

Suggested color roles

primary

Use #A2D2FF as a dominant color for large sections or hero images to establish a refreshing and open feel.

secondary

Apply #BBE0E7 for backgrounds, secondary elements, or subtle patterns to add softness and depth.

accent

#5CACEE serves as an excellent accent for calls-to-action, important icons, or interactive elements, drawing attention without being overpowering.

background

#DEEDF0 is perfect for clean, light backgrounds, providing a subtle cool tint rather than stark white.

text

For optimal readability on #DEEDF0 or #BBE0E7, use a dark blue like #5CACEE or a charcoal black. For text on #5CACEE, use white or near-white.

Accessibility notes

  • Ensure sufficient contrast for text, especially when using lighter blues like #BBE0E7 or #A2D2FF for backgrounds.
  • #DEEDF0 is very light; use dark text like #5CACEE or black for good readability.
  • Be mindful of contrast between #A2D2FF and #87CEEB when used together for interactive elements.
  • Always test color combinations for WCAG AA compliance, particularly for critical information.

Recommended combinations

Ice Flow

Creates a soft, airy gradient or layered look, perfect for clean backgrounds or subtle UI elements.

#DEEDF0 · #BBE0E7 · #A2D2FF

Deep Lagoon

Ideal for establishing a cool, inviting depth, suitable for primary navigation or prominent graphic features.

#5CACEE · #87CEEB · #A2D2FF

Frosty Sky

Excellent for header sections, providing a light top with descending cool blues for a natural, serene feel.

#DEEDF0 · #87CEEB · #5CACEE

CSS variables

:root {
  --nordic-glacier-calm-1: #A2D2FF;
  --nordic-glacier-calm-2: #BBE0E7;
  --nordic-glacier-calm-3: #DEEDF0;
  --nordic-glacier-calm-4: #87CEEB;
  --nordic-glacier-calm-5: #5CACEE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "nordic-glacier-calm": {
        1: "#A2D2FF",
        2: "#BBE0E7",
        3: "#DEEDF0",
        4: "#87CEEB",
        5: "#5CACEE",
      }
    }
  }
}

Related searches

icy blue color palettecalm glacier colorsserene blue white schemecool tech design colorsfresh nature inspired palette

Palette colors

Hex values

Color 1#A2D2FF
·
Color 2#BBE0E7
·
Color 3#DEEDF0
·
Color 4#87CEEB
·
Color 5#5CACEE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.3:1Fail
1.1:1Fail
1.5:1Fail
2
1.1:1Fail
1.2:1Fail
1.2:1Fail
1.7:1Fail
3
1.3:1Fail
1.2:1Fail
1.4:1Fail
2:1Fail
4
1.1:1Fail
1.2:1Fail
1.4:1Fail
1.4:1Fail
5
1.5:1Fail
1.7:1Fail
2:1Fail
1.4:1Fail

Similar palettes

More like Nordic Glacier Calm

View all cool