Palette

Glacial Ice Cavern

Shimmering blues and deep aquas found within the depths of a pristine ice cavern.

cooldark5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#00203F#03396C#005B96#6497B1#B3CDE0

Palette guide

How to use Glacial Ice Cavern

Overview

The Glacial Ice Cavern palette delves into shimmering blues and deep aquas, reflecting the mysterious depths of a pristine ice cavern. Featuring the profound #00203F, robust #03396C, vivid #005B96, serene #6497B1, and the lightest #B3CDE0, this palette offers a rich, cool spectrum. Designers can craft immersive and sophisticated interfaces, guiding users through compelling visuals that evoke wonder and depth. Developers will find distinct yet harmonious shades for dark mode applications or elegant data displays. It's an excellent choice for projects that aim for a dramatic, yet refined aesthetic, reminiscent of hidden icy wonders.

Best used for

Luxury brand websites and apps
Immersive digital experiences (VR/AR)
Dark mode UI/UX design
Science and exploration themed content
Elegant art installation branding
High-end product display interfaces

Suggested color roles

primary

Utilize #03396C as a core color for main sections, headers, or prominent UI components, establishing a deep, trustworthy foundation.

secondary

Employ #005B96 for subheadings, detailed information panels, or active states, adding a brighter, more engaging blue.

accent

Apply #6497B1 for glowing highlights, interactive elements, or subtle graphic details to introduce an ethereal, icy sparkle.

background

Designate #00203F as the primary background color, creating a very dark, atmospheric, and sophisticated canvas for all content.

text

For optimal readability, use #B3CDE0 or pure white for all body text and essential information on dark backgrounds, ensuring high contrast.

Accessibility notes

Always use very light text (e.g., #B3CDE0 or pure white) on the dark backgrounds (#00203F, #03396C) to meet WCAG AA standards.
Ensure sufficient contrast for all text and interactive elements. Avoid using darker palette colors for text on similar dark backgrounds.
The accent color #6497B1 should have good contrast with surrounding elements when used for interactive components.
Consider using #B3CDE0 as a background for specific sections where dark text (e.g., black or #00203F) is preferred.

Recommended combinations

Cavern Depths

Creates a dramatic, legible layout, ideal for dark mode interfaces with clear content hierarchy.

#00203F · #B3CDE0 · #03396C

Shimmering Ice

Excellent for gradients or layered elements, mimicking the natural play of light in an ice cavern.

#03396C · #005B96 · #6497B1

Deep Glow

Provides a sense of depth and illumination, with glowing elements emerging from a dark, mysterious base.

#00203F · #6497B1 · #B3CDE0

CSS variables

:root {
  --glacial-ice-cavern-1: #00203F;
  --glacial-ice-cavern-2: #03396C;
  --glacial-ice-cavern-3: #005B96;
  --glacial-ice-cavern-4: #6497B1;
  --glacial-ice-cavern-5: #B3CDE0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glacial-ice-cavern": {
        1: "#00203F",
        2: "#03396C",
        3: "#005B96",
        4: "#6497B1",
        5: "#B3CDE0",
      }
    }
  }
}

Hex values

Color 1#00203F

Color 2#03396C

Color 3#005B96

Color 4#6497B1

Color 5#B3CDE0

Accessibility

Contrast checker

1.4:1Fail

2.3:1Fail

5.2:1AA

10:1AAA

1.4:1Fail

1.6:1Fail

3.7:1AA18

7:1AAA

2.3:1Fail

1.6:1Fail

2.2:1Fail

4.3:1AA18

5.2:1AA

3.7:1AA18

2.2:1Fail

1.9:1Fail

10:1AAA

7:1AAA

4.3:1AA18

1.9:1Fail

Similar palettes

More like Glacial Ice Cavern

Midnight Ocean Trench

Abyssal Bioluminescence

Abyssal Current Glide