Palette

Glacial Peak

A crisp, profound palette inspired by the majestic, cold beauty of towering glacial formations.

coolminimal5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#ADD8E6#F0F8FF#36454F#08294F#6A5ACD

Palette guide

How to use Glacial Peak

Overview

The "Glacial Peak" palette is a powerful blend of crisp, icy blues, stark whites, and deep, commanding grays and indigos, with a surprising touch of lavender. This palette is designed to convey the majestic, unyielding beauty of glacial formations. The pristine #F0F8FF provides a clean canvas, while #ADD8E6 offers a gentle, cool sky tone. The true depth comes from the almost black #08294F and the robust #36454F, grounding the lighter shades. The unique inclusion of #6A5ACD adds an unexpected sophisticated twist, making this palette versatile for both stark minimalism and elegant complexity.

Best used for

High-end technology or luxury brand sites
Educational platforms focused on science or environment
Photography portfolios with a dramatic aesthetic
Modern art gallery branding
Winter sports apparel design
Software interfaces requiring a sophisticated dark mode option

Suggested color roles

primary

#08294F - A very deep, authoritative indigo, ideal for strong branding, navigation, or dark mode backgrounds.

secondary

#36454F - A charcoal gray, excellent for subheadings, footer content, or as a secondary dark element.

accent

#6A5ACD - A striking medium purple, perfect for calls-to-action, interactive elements, or unique graphic flourishes.

background

#F0F8FF - An off-white that provides a clean, bright, and spacious foundation for content.

text

#ADD8E6 - A light blue, suitable for secondary text or captions on dark backgrounds. For primary text on light backgrounds, use #08294F or #36454F.

Accessibility notes

Ensure sufficient contrast for text using #ADD8E6 on a dark background like #08294F or #36454F.
When using #6A5ACD as an accent for text, verify it meets WCAG AA standards against its background.
#F0F8FF provides excellent contrast for dark text like #08294F or #36454F.
Avoid placing #ADD8E6 text directly on #F0F8FF as the contrast will be too low.

Recommended combinations

Deep Contrast

A strong visual impact: #F0F8FF background, #08294F for main text/elements, and #6A5ACD for key interactive points.

#F0F8FF · #08294F · #6A5ACD

Subtle Layers

For layering UI elements, use #F0F8FF as base, #ADD8E6 for subtle panels, and #36454F for text on those panels.

#ADD8E6 · #36454F · #F0F8FF

Regal Accent

#08294F as a dominant dark color, #6A5ACD as a highlight, and #ADD8E6 for secondary information.

#08294F · #6A5ACD · #ADD8E6

CSS variables

:root {
  --glacial-peak-1: #ADD8E6;
  --glacial-peak-2: #F0F8FF;
  --glacial-peak-3: #36454F;
  --glacial-peak-4: #08294F;
  --glacial-peak-5: #6A5ACD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glacial-peak": {
        1: "#ADD8E6",
        2: "#F0F8FF",
        3: "#36454F",
        4: "#08294F",
        5: "#6A5ACD",
      }
    }
  }
}

Hex values

Color 1#ADD8E6

Color 2#F0F8FF

Color 3#36454F

Color 4#08294F

Color 5#6A5ACD

Accessibility

Contrast checker

1.4:1Fail

6.5:1AA

9.5:1AAA

3.5:1AA18

1.4:1Fail

9.2:1AAA

13.6:1AAA

4.9:1AA

6.5:1AA

9.2:1AAA

1.5:1Fail

1.9:1Fail

9.5:1AAA

13.6:1AAA

1.5:1Fail

2.7:1Fail

3.5:1AA18

4.9:1AA

1.9:1Fail

2.7:1Fail

Similar palettes

More like Glacial Peak