Back to palettes

Palette

Glacial Lake Tranquil

Serene blues and cool grays reflect the untouched, tranquil beauty of a glacial lake.

Coolcalm5 colors
More Cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Glacial Lake Tranquil 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 Lake Tranquil.

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

Data visualization

#6C8CA7#AEC0CC#D2E0E6#4F708C#8EB0CC

Palette guide

How to use Glacial Lake Tranquil

Overview

The Glacial Lake Tranquil palette offers a serene and sophisticated blend of cool blues and muted grays, perfect for creating a calming digital experience. With shades like the foundational blue-gray #6C8CA7 and the soft, ethereal #D2E0E6, designers can evoke a sense of peace and clarity. The deeper #4F708C provides grounding, while #AEC0CC and #8EB0CC add subtle variations. This palette is ideal for projects requiring a touch of tranquility and understated elegance, guiding users through content with a gentle, reassuring visual flow. Developers will find these tones versatile for various UI components, from backgrounds to interactive elements.

Best used for

  • Wellness and meditation apps
  • Luxury spa or retreat branding
  • Nature photography portfolios
  • Eco-friendly product packaging
  • Healthcare and medical websites
  • Calming interior design inspiration

Suggested color roles

primary

Use #6C8CA7 as a foundational blue-gray for main sections or primary branding elements, offering a steady and calm presence.

secondary

Employ #AEC0CC for supporting content panels, secondary navigation, or subtle dividers, providing a lighter, harmonious contrast.

accent

Apply #4F708C sparingly for calls-to-action, important icons, or headings that require a deeper, more pronounced emphasis.

background

Utilize #D2E0E6 as a clean, airy background color, ensuring excellent readability and a spacious feel.

text

For body text, use #4F708C on light backgrounds like #D2E0E6 to ensure strong readability, or a dark charcoal for general content.

Accessibility notes

  • Ensure #4F708C text on #D2E0E6 background meets WCAG AAA contrast ratios for optimal readability.
  • Avoid using #AEC0CC or #8EB0CC for small text on #D2E0E6, as contrast may be insufficient.
  • Use #6C8CA7 for interactive elements like buttons to provide clear visual cues and affordance.
  • For larger headings, #8EB0CC can be paired with #4F708C as a background, but always verify contrast.

Recommended combinations

Calm Header

A strong header (#4F708C) on a very light background (#D2E0E6) with a subtle secondary element (#AEC0CC).

#4F708C · #D2E0E6 · #AEC0CC

Subtle UI

A balanced interface with a mid-tone primary (#6C8CA7), a slightly lighter supporting element (#8EB0CC), and a soft background (#D2E0E6).

#6C8CA7 · #8EB0CC · #D2E0E6

Deep Contrast

Leverage the deepest blue (#4F708C) against the lightest background (#D2E0E6), balanced by a mid-tone (#6C8CA7) for content.

#4F708C · #D2E0E6 · #6C8CA7

CSS variables

:root {
  --glacial-lake-tranquil-1: #6C8CA7;
  --glacial-lake-tranquil-2: #AEC0CC;
  --glacial-lake-tranquil-3: #D2E0E6;
  --glacial-lake-tranquil-4: #4F708C;
  --glacial-lake-tranquil-5: #8EB0CC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glacial-lake-tranquil": {
        1: "#6C8CA7",
        2: "#AEC0CC",
        3: "#D2E0E6",
        4: "#4F708C",
        5: "#8EB0CC",
      }
    }
  }
}

Related searches

calm blue gray color schemeserene website colorstranquil branding palettecool tone ui designnature inspired web colors

Palette colors

Hex values

Color 1#6C8CA7
·
Color 2#AEC0CC
·
Color 3#D2E0E6
·
Color 4#4F708C
·
Color 5#8EB0CC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
2.6:1Fail
1.5:1Fail
1.6:1Fail
2
1.9:1Fail
1.4:1Fail
2.8:1Fail
1.2:1Fail
3
2.6:1Fail
1.4:1Fail
3.9:1AA18
1.7:1Fail
4
1.5:1Fail
2.8:1Fail
3.9:1AA18
2.3:1Fail
5
1.6:1Fail
1.2:1Fail
1.7:1Fail
2.3:1Fail

Similar palettes

More like Glacial Lake Tranquil

View all Cool