Back to palettes

Palette

Winter Hearth Frost

The crisp chill of winter air softened by the inviting glow of a distant, warm hearth.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#F8F8FF#E0FFFF#ADD8E6#B0E0E6#A52A2A

Palette guide

How to use Winter Hearth Frost

Overview

The Winter Hearth Frost palette beautifully contrasts the crisp chill of winter air with the inviting glow of a distant hearth. This unique combination features cool, icy blues like #ADD8E6 and #B0E0E6, alongside the profound warmth of #A52A2A. The light, airy whites, #F8F8FF and #E0FFFF, provide a clean, frosty canvas, allowing the bolder elements to truly pop. Designers can leverage this palette to create engaging visuals that balance coziness with freshness, ideal for projects aiming to evoke comfort, warmth, and a touch of seasonal elegance.

Best used for

  • Holiday marketing campaigns
  • Cozy home decor branding
  • Winter event invitations
  • Seasonal product packaging
  • Lifestyle blogs and magazines
  • Cafe or bakery branding

Suggested color roles

primary

Use #A52A2A for strong calls to action, important headings, or key brand elements to convey warmth and urgency.

secondary

Ideal for subheadings, background sections, or supporting graphical elements using #ADD8E6, offering a cool contrast.

accent

A brighter, cool accent using #B0E0E6 for interactive elements, highlights, or decorative details, symbolizing frost.

background

Provides a clean, slightly off-white base with #F8F8FF, creating an airy and crisp foundation.

text

Excellent for main body text using #A52A2A on light backgrounds like #F8F8FF, ensuring strong readability with a warm touch.

Accessibility notes

  • Ensure #A52A2A text on #F8F8FF or #E0FFFF backgrounds meets WCAG AA contrast ratios.
  • Avoid using #ADD8E6 or #B0E0E6 for small text against very light backgrounds.
  • The contrast between #ADD8E6 and #B0E0E6 is low; avoid using them together for critical information.
  • Always test color pairings for interactive elements to ensure clear visibility for all users.

Recommended combinations

Hearth Warmth

Striking contrast for main content, balancing warm and cool tones effectively.

#A52A2A · #F8F8FF · #ADD8E6

Frosty Air

Creates a light, cool, and ethereal feel, perfect for backgrounds or subtle design elements.

#E0FFFF · #ADD8E6 · #B0E0E6

Cozy Contrast

Highlights the warm accent against a crisp, light background, ideal for calls to action.

#A52A2A · #E0FFFF · #F8F8FF

CSS variables

:root {
  --winter-hearth-frost-1: #F8F8FF;
  --winter-hearth-frost-2: #E0FFFF;
  --winter-hearth-frost-3: #ADD8E6;
  --winter-hearth-frost-4: #B0E0E6;
  --winter-hearth-frost-5: #A52A2A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "winter-hearth-frost": {
        1: "#F8F8FF",
        2: "#E0FFFF",
        3: "#ADD8E6",
        4: "#B0E0E6",
        5: "#A52A2A",
      }
    }
  }
}

Related searches

winter red blue palettecozy cool color schemefestive seasonal colorswarm and frosty designholiday branding palette

Palette colors

Hex values

Color 1#F8F8FF
·
Color 2#E0FFFF
·
Color 3#ADD8E6
·
Color 4#B0E0E6
·
Color 5#A52A2A
·

Accessibility

Contrast checker

1
2
3
4
5
1
1:1Fail
1.4:1Fail
1.4:1Fail
6.7:1AA
2
1:1Fail
1.4:1Fail
1.4:1Fail
6.7:1AA
3
1.4:1Fail
1.4:1Fail
1.1:1Fail
4.6:1AA
4
1.4:1Fail
1.4:1Fail
1.1:1Fail
4.9:1AA
5
6.7:1AA
6.7:1AA
4.6:1AA
4.9:1AA

Similar palettes

More like Winter Hearth Frost

View all cool
Berry Winter Hearth
Nordic Winter Hearth
Arctic Bloom Whisper
Arctic Fox Frost
Berry Glaze Frost
Frost Berry Chill