Back to palettes

Palette

Icy Lake Glimmer

A serene collection of pale blues and whites, capturing the peaceful shimmer of a frozen lake.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Icy Lake Glimmer 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 Icy Lake Glimmer.

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 Icy Lake Glimmer

Overview

The "Icy Lake Glimmer" palette offers a refreshing collection of pale blues and near-whites, perfect for creating serene and expansive digital experiences. With hues like light blue #ADD8E6, powder blue #B0E0E6, and a pristine white #F0FFFF, this palette evokes calm and clarity. Designers can leverage its gentle transitions for backgrounds, subtle UI elements, or as a foundational theme for health, wellness, or nature-inspired brands. Developers will find these light values easy to combine, though careful attention to contrast will be essential for readability, especially with text. It's ideal for projects requiring a clean, airy, and tranquil aesthetic.

Best used for

  • Health and wellness app interfaces
  • Winter-themed website designs
  • Minimalist branding for spas or retreats
  • Backgrounds for photography portfolios
  • E-commerce sites for natural products
  • Environmental awareness campaigns

Suggested color roles

primary

Use #ADD8E6 (Light Blue) for prominent header sections, hero image overlays, or primary call-to-action buttons where a soft, inviting feel is desired.

secondary

Employ #B0E0E6 (Powder Blue) for sub-headers, secondary navigation, or card backgrounds to add subtle variation without overwhelming the primary.

accent

Apply #AFEEEE (Pale Turquoise) for interactive elements like hover states, small icons, or progress indicators, providing a gentle highlight.

background

Utilize #F0FFFF (Azure) as a clean, bright canvas for content, ensuring a light and airy feel across the application or website.

text

The palette's colors are too light for main body text. For primary text, use a dark charcoal or black for readability. For large, decorative headings on a dark background, #ADD8E6 could work.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using lighter palette colors like #F0FFFF for content areas.
  • Avoid using #ADD8E6 or #B0E0E6 for small text on light backgrounds; always opt for a much darker neutral for readability.
  • Verify all interactive elements meet WCAG contrast guidelines for both normal and large text sizes.
  • Consider providing a high-contrast mode for users with visual impairments, as this palette is inherently low-contrast.

Recommended combinations

Soft UI Base

Ideal for clean, modern user interfaces where #F0FFFF serves as the background, #B0E0E6 for card elements, and #ADD8E6 for subtle highlights.

#F0FFFF · #B0E0E6 · #ADD8E6

Header & Detail

Use #ADD8E6 for a hero section background, with light text (e.g., near-white) and #AFEEEE for secondary information or decorative elements.

#ADD8E6 · #F0FFFF · #AFEEEE

Interactive States

Apply #B0E0E6 for a button's default state, #ADD8E6 for its hover state, and #AFEEEE for a soft border or icon accent.

#B0E0E6 · #ADD8E6 · #AFEEEE

CSS variables

:root {
  --icy-lake-glimmer-1: #ADD8E6;
  --icy-lake-glimmer-2: #B0E0E6;
  --icy-lake-glimmer-3: #AFEEEE;
  --icy-lake-glimmer-4: #E0FFFF;
  --icy-lake-glimmer-5: #F0FFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "icy-lake-glimmer": {
        1: "#ADD8E6",
        2: "#B0E0E6",
        3: "#AFEEEE",
        4: "#E0FFFF",
        5: "#F0FFFF",
      }
    }
  }
}

Related searches

pale blue color schemeserene web design colorswinter palette hex codeslight blue ui inspirationcalm brand colors

Palette colors

Hex values

Color 1#ADD8E6
·
Color 2#B0E0E6
·
Color 3#AFEEEE
·
Color 4#E0FFFF
·
Color 5#F0FFFF
·

Accessibility

Contrast checker

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

Similar palettes

More like Icy Lake Glimmer

View all cool