Back to palettes

Palette

Glacier Bloom

Cool blues and hints of frosty white, imagining delicate flowers blooming against a stark, glacial backdrop.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#ADD8E6#C0E6F0#D9F3F7#7ACEE3#5AB9D0

Palette guide

How to use Glacier Bloom

Overview

The Glacier Bloom palette is a refreshing and delicate collection of cool blues, reminiscent of fragile flowers emerging against an icy backdrop. It features light, airy tones like #D9F3F7 and #C0E6F0, which provide a sense of purity and expansion. These are beautifully complemented by the slightly deeper yet still vibrant #ADD8E6, #7ACEE3, and #5AB9D0, which add depth and a touch of invigorating coolness. This palette is exceptionally versatile for designers and developers seeking to convey freshness, clarity, and a gentle, optimistic mood. It's perfect for creating clean, inviting, and subtly dynamic visual experiences.

Best used for

  • Skincare or beauty product branding
  • Fresh, clean food packaging
  • Baby or children's product designs
  • Spring/summer digital campaigns
  • Health and wellness applications
  • Minimalist website designs

Suggested color roles

primary

#5AB9D0 (Medium Blue) - Ideal for main headings, important calls to action, or key graphical elements, providing a clear yet gentle presence.

secondary

#7ACEE3 (Light Cerulean) - Use for sub-sections, secondary navigation, or larger areas where a vibrant but soft blue is desired.

accent

#ADD8E6 (Light Blue) - Perfect for subtle highlights, interactive states, or decorative flourishes that maintain the light, airy feel.

background

#D9F3F7 (Pale Aqua) - A very light, almost white background that creates an open, clean canvas and ensures excellent readability for darker text.

text

A dark gray such as #333333 offers optimal contrast for body text. #5AB9D0 works well for headings or prominent text.

Accessibility notes

  • #5AB9D0 and #7ACEE3 offer good contrast against #D9F3F7 for most text sizes.
  • Exercise caution when using #ADD8E6 or #C0E6F0 for text against #D9F3F7; ensure sufficient contrast.
  • For interactive elements, ensure distinct visual feedback beyond just color change.
  • Always use a high-contrast combination like dark text on #D9F3F7 for essential information.

Recommended combinations

Fresh UI

A crisp, clean interface with a pale background, lighter card elements, and a vibrant primary action color.

#D9F3F7 · #C0E6F0 · #5AB9D0

Gentle Gradient

Create smooth, uplifting gradients for hero banners or background sections, simulating a clear sky.

#ADD8E6 · #7ACEE3 · #5AB9D0

Accent Pop

Use the palest blue as a canvas, light blue for content, and the cerulean for a refreshing accent or link color.

#D9F3F7 · #ADD8E6 · #7ACEE3

CSS variables

:root {
  --glacier-bloom-1: #ADD8E6;
  --glacier-bloom-2: #C0E6F0;
  --glacier-bloom-3: #D9F3F7;
  --glacier-bloom-4: #7ACEE3;
  --glacier-bloom-5: #5AB9D0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glacier-bloom": {
        1: "#ADD8E6",
        2: "#C0E6F0",
        3: "#D9F3F7",
        4: "#7ACEE3",
        5: "#5AB9D0",
      }
    }
  }
}

Related searches

fresh blue color palettespring glacier colorslight blue and aqua designserene floral ice schemeclean cool branding

Palette colors

Hex values

Color 1#ADD8E6
·
Color 2#C0E6F0
·
Color 3#D9F3F7
·
Color 4#7ACEE3
·
Color 5#5AB9D0
·

Accessibility

Contrast checker

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

Similar palettes

More like Glacier Bloom

View all cool