Palette

Glacier Melt Runoff

Clear and pristine, like the icy, flowing waters of a glacial stream in a pristine wilderness.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#6A9CA4#8BBCC4#B2DDE3#E1F2F4#3B6B7A

Palette guide

How to use Glacier Melt Runoff

Overview

The "Glacier Melt Runoff" palette is clear and pristine, much like the icy, flowing waters of a glacial stream in a pristine wilderness. Ranging from the grounded #3B6B7A to the airy #E1F2F4, this collection offers a serene and refreshing aesthetic, perfect for conveying natural purity and calmness. The harmonious transition through #6A9CA4, #8BBCC4, and #B2DDE3 provides ample versatility for creating soft gradients, distinct visual sections, and refreshing interfaces. Designers and developers can leverage this palette to evoke a sense of clean nature, tranquility, and understated elegance, making it ideal for projects that value a gentle yet compelling visual presence.

Best used for

Natural skincare or organic product branding
Eco-friendly apparel companies
Wellness and mindfulness platforms
Water conservation initiatives
Home and garden design inspiration
Sustainable living blogs

Suggested color roles

primary

#6A9CA4 - A soft, muted blue-green that serves well for main headings, primary navigation, or call-to-action buttons, providing a calming and stable presence.

secondary

#8BBCC4 - A lighter, more expansive blue, suitable for secondary information panels, subheadings, or background sections that need a softer, more open feel.

accent

#3B6B7A - The deepest, most grounding shade, perfect for subtle highlights, interactive states, or to add gravitas to important information without harshness.

background

#E1F2F4 - The lightest color, an almost white aqua, ideal for expansive, clean page backgrounds that promote readability and a sense of spaciousness.

text

For text on light backgrounds like #E1F2F4, use #3B6B7A or a dark charcoal for optimal contrast. For text over darker shades, pure white is recommended.

Accessibility notes

The darkest color, #3B6B7A, provides good contrast for white text, suitable for WCAG AA standards.
Lighter shades like #B2DDE3 and #E1F2F4 require very dark text (black, charcoal) for sufficient readability.
Avoid using #8BBCC4 as text on #6A9CA4; the contrast may be insufficient for accessibility.
Always use a contrast checker for all text and interactive element pairings, especially with light-on-light combinations.

Recommended combinations

Flowing Stream

Create gentle, flowing gradients for backgrounds or large content blocks, mimicking the movement of clear water.

#E1F2F4 · #B2DDE3 · #8BBCC4

Grounded Serenity

Use the darkest for strong anchors, a mid-tone for supporting content, and the lightest for spacious, clean backgrounds.

#3B6B7A · #6A9CA4 · #E1F2F4

Misty Depths

Combine these mid-tones for layered UI elements or subtle visual distinctions, with the darkest for grounding accents.

#6A9CA4 · #8BBCC4 · #3B6B7A

CSS variables

:root {
  --glacier-melt-runoff-1: #6A9CA4;
  --glacier-melt-runoff-2: #8BBCC4;
  --glacier-melt-runoff-3: #B2DDE3;
  --glacier-melt-runoff-4: #E1F2F4;
  --glacier-melt-runoff-5: #3B6B7A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glacier-melt-runoff": {
        1: "#6A9CA4",
        2: "#8BBCC4",
        3: "#B2DDE3",
        4: "#E1F2F4",
        5: "#3B6B7A",
      }
    }
  }
}

Hex values

Color 1#6A9CA4

Color 2#8BBCC4

Color 3#B2DDE3

Color 4#E1F2F4

Color 5#3B6B7A

Accessibility

Contrast checker

1.5:1Fail

2.1:1Fail

2.6:1Fail

1.9:1Fail

1.5:1Fail

1.4:1Fail

1.8:1Fail

2.8:1Fail

2.1:1Fail

1.4:1Fail

1.3:1Fail

4:1AA18

2.6:1Fail

1.8:1Fail

1.3:1Fail

5.1:1AA

1.9:1Fail

2.8:1Fail

4:1AA18

5.1:1AA

Similar palettes

More like Glacier Melt Runoff