Back to palettes

Palette

Winter Hearth Glow

Deep reds and browns mimic the comforting warmth and glowing embers of a winter hearth.

warmcalm5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#3C1B1A#6F322F#A34E4B#D67370#F2A19F

Palette guide

How to use Winter Hearth Glow

Overview

The Winter Hearth Glow palette radiates comforting warmth, mimicking the rich embers and inviting glow of a winter hearth. This collection transitions from the deep, grounding #3C1B1A to the soft, glowing #F2A19F, offering a luxurious and cozy aesthetic. The vibrant mid-tones like #A34E4B and #D67370 provide excellent depth and richness, making it ideal for designs that require a sense of comfort, elegance, and traditional warmth. Designers can leverage this palette to craft visually inviting interfaces, sophisticated brand identities, or editorial layouts that communicate a sense of belonging and coziness.

Best used for

  • Luxury food and beverage brands
  • High-end furniture design
  • Traditional holiday marketing
  • Cozy cafe or restaurant branding
  • Sophisticated lifestyle products
  • Editorial design for winter themes

Suggested color roles

primary

Use #3C1B1A for strong headers, primary calls to action, or core brand elements to establish a rich, grounded presence.

secondary

Ideal for subheadings, secondary buttons, or larger content blocks using #6F322F, offering a sophisticated, deep red-brown.

accent

A vibrant, warm accent using #A34E4B for interactive elements, highlights, or graphical details that need a pop of color.

background

Provides a soft, warm, and inviting canvas with #F2A19F that allows darker elements to stand out elegantly.

text

Excellent for main body text using #3C1B1A on light backgrounds like #F2A19F, ensuring strong readability with a cozy feel.

Accessibility notes

  • Ensure #3C1B1A text on #F2A19F background meets WCAG AA contrast for optimal readability.
  • Avoid using #D67370 or #F2A19F for small text against similarly light backgrounds.
  • Use a contrast checker for all text and interactive element pairings to guarantee legibility.
  • For text on darker backgrounds like #3C1B1A, use #F2A19F or #D67370 for sufficient contrast.

Recommended combinations

Ember Depth

High-contrast combination for primary content, providing strong readability and a rich, warm feel.

#3C1B1A · #F2A19F · #A34E4B

Gentle Glow

Creates a soft, glowing effect, ideal for backgrounds or subtle UI elements, evoking warmth.

#D67370 · #F2A19F · #A34E4B

Rich Contrast

A balanced trio for layered elements or sections, providing depth and sophisticated warmth.

#6F322F · #F2A19F · #3C1B1A

CSS variables

:root {
  --winter-hearth-glow-1: #3C1B1A;
  --winter-hearth-glow-2: #6F322F;
  --winter-hearth-glow-3: #A34E4B;
  --winter-hearth-glow-4: #D67370;
  --winter-hearth-glow-5: #F2A19F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "winter-hearth-glow": {
        1: "#3C1B1A",
        2: "#6F322F",
        3: "#A34E4B",
        4: "#D67370",
        5: "#F2A19F",
      }
    }
  }
}

Related searches

warm red brown palettecozy winter colorsrich earthy tones designtraditional holiday brandinginviting color scheme

Palette colors

Hex values

Color 1#3C1B1A
·
Color 2#6F322F
·
Color 3#A34E4B
·
Color 4#D67370
·
Color 5#F2A19F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.7:1Fail
4.8:1AA
7.6:1AAA
2
1.6:1Fail
1.7:1Fail
3:1AA18
4.8:1AA
3
2.7:1Fail
1.7:1Fail
1.7:1Fail
2.8:1Fail
4
4.8:1AA
3:1AA18
1.7:1Fail
1.6:1Fail
5
7.6:1AAA
4.8:1AA
2.8:1Fail
1.6:1Fail

Similar palettes

More like Winter Hearth Glow

View all warm