Back to palettes

Palette

Cozy Autumn Fireside

Fiery oranges and soft yellows, capturing the inviting warmth of a crackling autumn fireside.

warmnatural5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cozy Autumn Fireside 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 Cozy Autumn Fireside.

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

Data visualization

#8D2D0C#BD4C0F#ED6C12#FCB05C#FFE599

Palette guide

How to use Cozy Autumn Fireside

Overview

The 'Cozy Autumn Fireside' palette captures the inviting warmth of a crackling autumn fire with its fiery oranges and soft yellows. This vibrant yet comforting collection features a deep burnt orange (#8D2D0C), a rich rust (#BD4C0F), a bright pumpkin orange (#ED6C12), a warm amber (#FCB05C), and a creamy pale yellow (#FFE599). Ideal for designers and developers seeking to evoke feelings of warmth, comfort, and seasonal cheer. These harmonious hues are perfect for projects that celebrate the autumn season, creating engaging and inviting user experiences across digital and print platforms.

Best used for

  • Autumn seasonal marketing campaigns
  • Cozy cafe or bakery branding
  • Fall festival promotions
  • Home decor and textile designs
  • Thanksgiving holiday themes
  • Fireside-themed app interfaces

Suggested color roles

primary

#8D2D0C (Burnt Orange) - A deep, anchoring primary color, ideal for main structures, headers, or strong brand elements.

secondary

#ED6C12 (Pumpkin Orange) - Provides a vibrant, energetic complement, excellent for secondary content, calls-to-action, or accents.

accent

#FCB05C (Amber) - A warm, glowing accent perfect for highlights, interactive elements, or a touch of soft radiance.

background

#FFE599 (Pale Yellow) - A soft, luminous background that brightens the palette while maintaining warmth, perfect for content areas.

text

#BD4C0F (Rust) - Suitable for larger, decorative text. For body text, use a dark brown (e.g., #4F4F4F) or black on lighter backgrounds for readability.

Accessibility notes

  • Ensure sufficient contrast when pairing lighter colors like #FCB05C with #FFE599 for text.
  • For body text, use dark colors like #8D2D0C or a deep charcoal against #FFE599 backgrounds.
  • The darker oranges offer good contrast for white or off-white text, improving legibility.
  • Avoid using #FCB05C for small body text unless on a significantly darker background to ensure legibility.

Recommended combinations

Fireside Glow

Ideal for warm website headers, autumn promotions, or inviting branding.

#8D2D0C · #ED6C12 · #FFE599

Amber Warmth

Great for soft backgrounds, content cards, or where a gentle, warm feel is desired.

#BD4C0F · #FCB05C · #FFE599

Autumn Blaze

Perfect for bold calls-to-action, energetic illustrations, or accentuating key information.

#ED6C12 · #8D2D0C · #BD4C0F

CSS variables

:root {
  --cozy-autumn-fireside-1: #8D2D0C;
  --cozy-autumn-fireside-2: #BD4C0F;
  --cozy-autumn-fireside-3: #ED6C12;
  --cozy-autumn-fireside-4: #FCB05C;
  --cozy-autumn-fireside-5: #FFE599;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cozy-autumn-fireside": {
        1: "#8D2D0C",
        2: "#BD4C0F",
        3: "#ED6C12",
        4: "#FCB05C",
        5: "#FFE599",
      }
    }
  }
}

Related searches

autumn color palettecozy orange yellowfireside aestheticfall warm colorsseasonal comfort design

Palette colors

Hex values

Color 1#8D2D0C
·
Color 2#BD4C0F
·
Color 3#ED6C12
·
Color 4#FCB05C
·
Color 5#FFE599
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.7:1Fail
4.6:1AA
6.7:1AA
2
1.7:1Fail
1.6:1Fail
2.7:1Fail
4:1AA18
3
2.7:1Fail
1.6:1Fail
1.7:1Fail
2.5:1Fail
4
4.6:1AA
2.7:1Fail
1.7:1Fail
1.5:1Fail
5
6.7:1AA
4:1AA18
2.5:1Fail
1.5:1Fail

Similar palettes

More like Cozy Autumn Fireside

View all warm