Palette

Nordic Winter Frost

A serene palette capturing the crisp, cool essence of a frozen Nordic landscape.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Nordic Winter Frost 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 Nordic Winter Frost.

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

Data visualization

#1F2833#3A4750#A9CCE3#D4E6F1#F2F4F7

Palette guide

How to use Nordic Winter Frost

Overview

The Nordic Winter Frost palette captures the crisp, cool essence of a frozen Scandinavian landscape, offering a sophisticated range of blue-greys and icy whites. This collection is perfect for designers and developers seeking a clean, minimalist aesthetic with a touch of elegance. Anchoring the palette are deep tones like #1F2833 and #3A4750, beautifully contrasted by the ethereal #A9CCE3, the softer #D4E6F1, and the bright, almost white #F2F4F7. This palette excels in creating a sense of calm, precision, and modern simplicity, making it highly versatile for various digital and print applications that benefit from a cool, clear, and understated feel.

Best used for

Modern tech interfaces and dashboards
High-end fashion or lifestyle branding
Minimalist architectural visualization
Educational platforms requiring a clean, focused design
Winter-themed marketing campaigns
Editorial layouts for sophisticated content

Suggested color roles

primary

Use #3A4750 as a robust primary color for main content blocks or key navigation, providing a solid yet understated foundation.

secondary

Employ #A9CCE3 for supporting visual elements, secondary buttons, or subtle highlights, adding a touch of icy clarity.

accent

Reserve #1F2833 for strong accents, important calls to action, or critical text, leveraging its deep contrast and authority.

background

Utilize #F2F4F7 as the primary background color, offering a clean, bright, and expansive canvas that enhances readability.

text

For maximum legibility, use #1F2833 for all body text and headings on light backgrounds. For lighter text on dark elements, a crisp white works well.

Accessibility notes

Ensure #1F2833 on #F2F4F7 provides excellent contrast for all text, meeting WCAG AAA standards.
Verify that #3A4750 on #F2F4F7 maintains good readability for body text, typically meeting WCAG AA.
Be cautious when using #D4E6F1 on #F2F4F7 for small text or icons, as contrast may be insufficient.
Interactive elements should have clearly defined hover and focus states, perhaps using #1F2833 for strong visual feedback.

Recommended combinations

Deep Frost

A strong header (#1F2833) on a crisp background (#F2F4F7), with a soft blue accent (#A9CCE3) for subheadings or highlights.

#1F2833 · #F2F4F7 · #A9CCE3

Icy Clarity

Ideal for content blocks, where #3A4750 provides structure, #D4E6F1 offers a subtle visual break, and #F2F4F7 is the clean base.

#3A4750 · #D4E6F1 · #F2F4F7

Subtle Layers

Use #A9CCE3 for a card background, #3A4750 for text, and #1F2833 for a bold icon or border, creating depth.

#A9CCE3 · #3A4750 · #1F2833

CSS variables

:root {
  --nordic-winter-frost-1: #1F2833;
  --nordic-winter-frost-2: #3A4750;
  --nordic-winter-frost-3: #A9CCE3;
  --nordic-winter-frost-4: #D4E6F1;
  --nordic-winter-frost-5: #F2F4F7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "nordic-winter-frost": {
        1: "#1F2833",
        2: "#3A4750",
        3: "#A9CCE3",
        4: "#D4E6F1",
        5: "#F2F4F7",
      }
    }
  }
}

Hex values

Color 1#1F2833

Color 2#3A4750

Color 3#A9CCE3

Color 4#D4E6F1

Color 5#F2F4F7

Accessibility

Contrast checker

1.6:1Fail

8.8:1AAA

11.6:1AAA

13.5:1AAA

1.6:1Fail

5.7:1AA

7.5:1AAA

8.7:1AAA

8.8:1AAA

5.7:1AA

1.3:1Fail

1.5:1Fail

11.6:1AAA

7.5:1AAA

1.3:1Fail

1.2:1Fail

13.5:1AAA

8.7:1AAA

1.5:1Fail

1.2:1Fail

Similar palettes

More like Nordic Winter Frost

View all cool

Alpine Frost Serenity

Frozen Lake Reflection