Back to palettes

Palette

Glacial Lagoon

Inspired by the tranquil blues of remote glacial waters, merging icy clarity with profound depth.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#87CEEB#6A5ACD#483D8B#0000CD#000080

Palette guide

How to use Glacial Lagoon

Overview

The Glacial Lagoon palette is inspired by the tranquil yet profound depths of remote glacial waters, merging icy clarity with deep, commanding blues. This cool-toned collection, ranging from the bright #87CEEB to the intense #000080, offers designers a powerful yet serene aesthetic. The vibrant #87CEEB provides a refreshing highlight, while #6A5ACD and #483D8B introduce rich, deeper tones. The profound #0000CD and #000080 anchor the palette, making it ideal for projects that require both a sense of calm and undeniable authority, such as sophisticated branding or immersive digital experiences.

Best used for

  • Luxury brand websites and apps
  • Deep sea or space exploration themes
  • Financial technology interfaces
  • Educational content on geology/oceans
  • High-end corporate branding
  • Mystery or dramatic themed designs

Suggested color roles

primary

#000080 - This very deep, profound blue serves as a powerful primary color for main navigation, headers, or foundational elements, conveying gravitas.

secondary

#6A5ACD - A rich, medium-dark blue, excellent for secondary calls-to-action, important data blocks, or sub-headings, offering depth without being overwhelming.

accent

#87CEEB - This vibrant sky blue is perfect for striking accents, interactive element hover states, or small but critical details that need to pop against darker backgrounds.

background

#87CEEB - While light, this vibrant blue can be used for energetic backgrounds, but for readability, consider a very light grey or white for main content areas.

text

#000080 - Excellent for primary body text on light backgrounds (e.g., white or very light grey), ensuring strong readability. Use white for text on darker blues like #000080.

Accessibility notes

  • Ensure white text on #000080, #0000CD, or #483D8B backgrounds provides sufficient contrast (WCAG AA compliant).
  • Avoid using #87CEEB for small text on medium blues like #6A5ACD, as contrast may be insufficient.
  • Use #87CEEB for interactive elements, but confirm it contrasts well against its immediate background.
  • When designing, prioritize high contrast for body text and essential UI elements, particularly with the darker blues.

Recommended combinations

Deep Impact

Provides high contrast for powerful headings, calls-to-action, and critical information against a vibrant highlight.

#000080 · #87CEEB · #6A5ACD

Mystic Depths

Creates a deep, nuanced gradient or layered effect, ideal for immersive backgrounds, card designs, or sophisticated data visualization.

#483D8B · #6A5ACD · #0000CD

Icy Clarity

Uses the lightest blue as a vibrant element against the darkest blue, with white text on the dark blue for clear readability.

#87CEEB · #000080 · #483D8B

CSS variables

:root {
  --glacial-lagoon-1: #87CEEB;
  --glacial-lagoon-2: #6A5ACD;
  --glacial-lagoon-3: #483D8B;
  --glacial-lagoon-4: #0000CD;
  --glacial-lagoon-5: #000080;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glacial-lagoon": {
        1: "#87CEEB",
        2: "#6A5ACD",
        3: "#483D8B",
        4: "#0000CD",
        5: "#000080",
      }
    }
  }
}

Related searches

deep blue lagoon paletteglacial water colorscool serene designroyal blue color schememysterious blue ui

Palette colors

Hex values

Color 1#87CEEB
·
Color 2#6A5ACD
·
Color 3#483D8B
·
Color 4#0000CD
·
Color 5#000080
·

Accessibility

Contrast checker

1
2
3
4
5
1
3:1AA18
5.2:1AA
6.4:1AA
9.2:1AAA
2
3:1AA18
1.7:1Fail
2.1:1Fail
3:1AA18
3
5.2:1AA
1.7:1Fail
1.2:1Fail
1.8:1Fail
4
6.4:1AA
2.1:1Fail
1.2:1Fail
1.4:1Fail
5
9.2:1AAA
3:1AA18
1.8:1Fail
1.4:1Fail

Similar palettes

More like Glacial Lagoon

View all cool
Calm Lake Reflections
Glacial Lagoon Calm
Whispering Sky Hues
Winter Solstice Calm
Aegean Isle Horizon
Aegean Sea Serene