Frosted Glacial Ice & Midnight Pines Category: Seasonal 14,800/mo searches

Winter Color Palette — HEX Codes, Swatches & UI Palette

Drawing inspiration from frosted pine needles, glacial ice sheets, and dark Nordic twilight. A sophisticated pairing of crisp ice blues and silver slate with authoritative deep evergreen and midnight sapphire.

Frost Surface

Ice Blue

#D0E8F2

Secondary Tint

Glacial Steel

#79A3B1

Rich Organic Dark

Deep Forest Pine

#1B4332

Primary Dark Ground

Midnight Navy

#0F1E36

Clean Background

Frosted Silver

#ECEFF1

Open in Web Studio Color Wheel Tint & Shade Scale

Color Swatches & Technical Specifications

Exact color codes, luminance values, and WCAG contrast ratings for each swatch in the Winter Color Palette.

Ice Blue

Frost Surface

HEX #D0E8F2

RGB rgb(208, 232, 242)

HSL hsl(198deg, 57%, 88%)

vs White: 1.27:1 (Fail) vs Black: 16.51:1 (AAA)

Glacial Steel

Secondary Tint

HEX #79A3B1

RGB rgb(121, 163, 177)

HSL hsl(195deg, 26%, 58%)

vs White: 2.73:1 (Fail) vs Black: 7.69:1 (AAA)

Deep Forest Pine

Rich Organic Dark

HEX #1B4332

RGB rgb(27, 67, 50)

HSL hsl(154deg, 43%, 18%)

vs White: 11.08:1 (AAA) vs Black: 1.9:1 (Fail)

Midnight Navy

Primary Dark Ground

HEX #0F1E36

RGB rgb(15, 30, 54)

HSL hsl(217deg, 57%, 14%)

vs White: 16.67:1 (AAA) vs Black: 1.26:1 (Fail)

Frosted Silver

Clean Background

HEX #ECEFF1

RGB rgb(236, 239, 241)

HSL hsl(204deg, 15%, 94%)

vs White: 1.15:1 (Fail) vs Black: 18.18:1 (AAA)

UI Design & Color Hierarchy Guide

Outstanding for enterprise fintech, luxury corporate websites, and modern dark-mode software interfaces where clarity, trust, and premium restraint are paramount.

60% Dominant Base

Use the primary neutral/light swatch (Frosted Silver) for canvas backgrounds and card surfaces.

30% Structural Secondary

Apply midtones for navigation bars, card headers, borders, and secondary buttons.

10% Accent Callout

Reserve high-saturation focal colors for CTAs, conversion badges, and active state highlights.

WCAG 2.1 Accessibility & Contrast Matrix

Legibility ratings between palette elements and key backgrounds (Lightest: Frosted Silver | Darkest: Midnight Navy):

Swatch	Contrast vs Light Canvas	Contrast vs Dark Canvas
Ice Blue (#D0E8F2)	1.1:1 Fail	13.1:1 AAA
Glacial Steel (#79A3B1)	2.37:1 Fail	6.1:1 AA
Deep Forest Pine (#1B4332)	9.59:1 AAA	1.5:1 Fail
Midnight Navy (#0F1E36)	14.43:1 AAA	1.0:1 Fail
Frosted Silver (#ECEFF1)	1.0:1 Fail	14.43:1 AAA

CSS Custom Properties & Design Tokens

Copy and paste production-ready tokens directly into your CSS stylesheet or Tailwind CSS configuration:

CSS Variables

:root {
  --color-1: #D0E8F2; /* Ice Blue - Frost Surface */
  --color-2: #79A3B1; /* Glacial Steel - Secondary Tint */
  --color-3: #1B4332; /* Deep Forest Pine - Rich Organic Dark */
  --color-4: #0F1E36; /* Midnight Navy - Primary Dark Ground */
  --color-5: #ECEFF1; /* Frosted Silver - Clean Background */
}

Tailwind CSS Config

{
  colors: {
    'palette-1': '#D0E8F2',
    'palette-2': '#79A3B1',
    'palette-3': '#1B4332',
    'palette-4': '#0F1E36',
    'palette-5': '#ECEFF1'
  }
}

Explore More Curated Color Palettes

Browse seasonal palettes, retro aesthetic color schemes, nature tones, and dark mode themes.

All Color Palettes Named Color Dictionary Interactive Color Wheel