Palette

Cosmic Winter Chill

Evokes the deep, quiet expanse of a frozen night sky, dotted with distant starlight.

CoolMinimal5 colors

More Cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cosmic Winter Chill 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 Cosmic Winter Chill.

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

Data visualization

#000F2C#2C3E50#8A9CA8#4D648D#EAEAEA

Palette guide

How to use Cosmic Winter Chill

Overview

The Cosmic Winter Chill palette evokes the deep, quiet expanse of a frozen night sky, dotted with distant starlight. It features the profound #000F2C, transitioning through the cool #2C3E50 (Dark Slate Gray) and the sophisticated #4D648D. Lighter, ethereal shades like #8A9CA8 (Cadet Gray) and the luminous #EAEAEA (Alabaster) complete the spectrum, mimicking frosty glimmers. This palette is ideal for designs that aim for a minimalist, serene, and elegant feel, perfect for corporate branding, tech interfaces, or any project requiring a sense of calm sophistication.

Best used for

Minimalist website and app design
Corporate branding for tech or finance
Winter-themed digital art and photography
Luxury product packaging for cool tones
Educational platforms with a serious aesthetic
Dark mode applications with a clean, cool feel

Suggested color roles

primary

Use #000F2C as the dominant background for a profound, dark canvas, suitable for large areas.

secondary

Apply #2C3E50 for secondary backgrounds, panels, or distinct content blocks, adding subtle depth.

accent

Utilize #EAEAEA for highlighting key information, interactive elements, or a crisp, luminous accent.

background

The deep #000F2C and #2C3E50 are excellent for creating expansive, cool backdrops.

text

For primary text, use #EAEAEA against the darker backgrounds. For headings, #8A9CA8 or a crisp white works well.

Accessibility notes

Ensure #EAEAEA text has sufficient contrast against #000F2C, #2C3E50, and #4D648D backgrounds for readability.
Avoid using #4D648D text on #2C3E50 backgrounds for small text, as contrast might be low.
When using these grays and blues for data visualization, ensure distinct enough shades for colorblind users.
Consider providing a pure white text option for maximum legibility on the darkest backgrounds.

Recommended combinations

Frozen UI

Creates a clean dark mode UI with a profound background, a subtle dark gray panel, and clear, readable light gray text.

#000F2C · #2C3E50 · #EAEAEA

Starlight Glimmer

Ideal for layered elements, offering depth with a soft blue-gray accent for interactive components or icons.

#2C3E50 · #4D648D · #8A9CA8

Winter Gradient

Perfect for subtle background gradients or visual storytelling, moving from deep night to frosty light.

#000F2C · #4D648D · #EAEAEA

CSS variables

:root {
  --cosmic-winter-chill-1: #000F2C;
  --cosmic-winter-chill-2: #2C3E50;
  --cosmic-winter-chill-3: #8A9CA8;
  --cosmic-winter-chill-4: #4D648D;
  --cosmic-winter-chill-5: #EAEAEA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-winter-chill": {
        1: "#000F2C",
        2: "#2C3E50",
        3: "#8A9CA8",
        4: "#4D648D",
        5: "#EAEAEA",
      }
    }
  }
}

Hex values

Color 1#000F2C

Color 2#2C3E50

Color 3#8A9CA8

Color 4#4D648D

Color 5#EAEAEA

Accessibility

Contrast checker

1.7:1Fail

6.7:1AA

3.2:1AA18

15.8:1AAA

1.7:1Fail

3.9:1AA18

1.8:1Fail

9.1:1AAA

6.7:1AA

3.9:1AA18

2.1:1Fail

2.4:1Fail

3.2:1AA18

1.8:1Fail

2.1:1Fail

5:1AA

15.8:1AAA

9.1:1AAA

2.4:1Fail

5:1AA

Similar palettes

More like Cosmic Winter Chill

Arctic Fox Camouflage

Frosted Juniper Berries