Palette

Frozen Night Sky

Deep blues progressing to icy whites, reflecting the stark, quiet beauty of a clear winter night.

cooldark5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Frozen Night Sky 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 Frozen Night Sky.

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

Data visualization

#000033#191970#4169E1#B0C4DE#E0FFFF

Palette guide

How to use Frozen Night Sky

Overview

The "Frozen Night Sky" palette captures the stark, quiet beauty of a clear winter night, transitioning from profound dark blues to ethereal icy whites. This cool palette offers a dramatic yet serene aesthetic, ideal for projects requiring depth and sophistication. With deep tones like #000033 and #191970 providing a strong foundation, and vibrant #4169E1 offering a captivating mid-tone, designers can craft compelling visual narratives. Lighter shades such as #B0C4DE and #E0FFFF introduce a sense of frosty clarity. It's a versatile choice for creating immersive digital experiences, elegant branding, or atmospheric illustrations that evoke the tranquility of a moonlit, frozen landscape.

Best used for

Luxury brand websites
Sci-fi game interfaces
Night photography portfolios
Elegant event invitations
Dark mode UI themes
Winter-themed digital art

Suggested color roles

primary

Utilize #191970 as the core deep blue for main sections, headers, or significant branding elements, establishing a strong, sophisticated presence.

secondary

Employ #4169E1 for subheadings, active states, or key graphical elements, providing a vibrant contrast and visual interest against darker tones.

accent

Reserve #E0FFFF for crisp highlights, small icons, or interactive elements, offering a brilliant, icy pop that mimics starlight.

background

Use #000033 for a dramatic, immersive background in dark mode applications or for full-screen hero sections, ensuring deep visual impact.

text

For primary text on dark backgrounds, use #B0C4DE or #E0FFFF to ensure excellent readability. For lighter backgrounds, a deep navy like #000033 works well.

Accessibility notes

Ensure high contrast when pairing the darkest (#000033, #191970) with the lightest (#B0C4DE, #E0FFFF) colors for text, adhering to WCAG guidelines.
Avoid using #B0C4DE for small text on #E0FFFF, as the contrast might be insufficient for readability.
Interactive elements should clearly indicate their state; #4169E1 is excellent for hover or active states against darker blues.
Consider larger font sizes or bolding when using mid-tones like #B0C4DE on slightly darker blues to improve legibility for all users.

Recommended combinations

Deep Night

Perfect for creating a sophisticated dark mode interface or a dramatic background with stark, readable text.

#000033 · #191970 · #E0FFFF

Icy Glow

Ideal for data visualization or dashboards, where #4169E1 can highlight key metrics against a cool blue base.

#191970 · #4169E1 · #B0C4DE

Starlight Contrast

Excellent for hero sections or prominent calls-to-action, with #E0FFFF for primary text and #4169E1 for buttons.

#000033 · #E0FFFF · #4169E1

CSS variables

:root {
  --frozen-night-sky-1: #000033;
  --frozen-night-sky-2: #191970;
  --frozen-night-sky-3: #4169E1;
  --frozen-night-sky-4: #B0C4DE;
  --frozen-night-sky-5: #E0FFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "frozen-night-sky": {
        1: "#000033",
        2: "#191970",
        3: "#4169E1",
        4: "#B0C4DE",
        5: "#E0FFFF",
      }
    }
  }
}

Hex values

Color 1#000033

Color 2#191970

Color 3#4169E1

Color 4#B0C4DE

Color 5#E0FFFF

Accessibility

Contrast checker

1.3:1Fail

4.1:1AA18

11.3:1AAA

19:1AAA

1.3:1Fail

3.1:1AA18

8.3:1AAA

14.1:1AAA

4.1:1AA18

3.1:1AA18

2.7:1Fail

4.6:1AA

11.3:1AAA

8.3:1AAA

2.7:1Fail

1.7:1Fail

19:1AAA

14.1:1AAA

4.6:1AA

1.7:1Fail

Similar palettes

More like Frozen Night Sky

View all cool

Cobalt Midnight Sky

Twilight Metropolis Blue

Urban Twilight Veil

Abyssal Current Glide

Arctic Ice Cavern

Arctic Ocean Depths