Back to palettes

Palette

Cabin Hearth

Earthy browns and a hint of fiery red evoke the rustic warmth and comfort of a cozy cabin by the hearth.

warmnatural5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#8B4513#A0522D#B22222#D2B48C#5C4033

Palette guide

How to use Cabin Hearth

Overview

The Cabin Hearth palette features earthy browns and a hint of fiery red, evoking the rustic warmth and comfort of a cozy cabin by the hearth. This warm collection includes the saddle brown of #8B4513, the sienna of #A0522D, the firebrick red of #B22222, the light tan of #D2B48C, and the dark brown of #5C4033. It's an excellent choice for designers aiming to create inviting, natural, and robust visuals. The palette evokes a sense of homely comfort, outdoor adventure, and the timeless appeal of wood and fire, perfect for projects that celebrate rustic charm and a cozy atmosphere.

Best used for

  • Rustic cabin rentals and lodge branding
  • Cozy cafe and coffee shop branding
  • Outdoor adventure gear and apparel
  • Natural woodcrafts and handmade goods
  • Autumn seasonal themes and decor
  • Warm interior design blogs and services

Suggested color roles

primary

Use #8B4513 as a warm, inviting saddle brown primary color, perfect for main brand elements or welcoming sections.

secondary

Apply #A0522D as a rich sienna secondary color, offering robust and earthy support.

accent

Introduce #B22222 as a fiery red accent, ideal for warm highlights, calls to action, or energetic touches.

background

Utilize #D2B48C as a light tan background, creating an airy and welcoming base.

text

For body text, #5C4033 (very dark brown) offers excellent readability against lighter colors in the palette, ensuring strong contrast.

Accessibility notes

  • #5C4033 offers excellent contrast for text against lighter colors like #D2B48C, ensuring readability for all users.
  • Be cautious when using #B22222 (red) for large blocks of text; ensure it has strong contrast against its background.
  • The earthy tones are generally good for distinguishing elements, but ensure text is always dark enough for readability.
  • Provide clear visual cues for interactive elements, possibly using the fiery red for calls to action or hover states.

Recommended combinations

Hearth Glow

Ideal for creating a warm, inviting header or hero section on a website or digital product.

#8B4513 · #B22222 · #D2B48C

Rustic Wood

Great for natural textures, robust branding elements, or creating a sense of artisanal quality.

#5C4033 · #A0522D · #8B4513

Cozy Fire

Perfect for highlighting special offers, creating a cozy atmosphere, or drawing attention to key messages.

#B22222 · #D2B48C · #A0522D

CSS variables

:root {
  --cabin-hearth-1: #8B4513;
  --cabin-hearth-2: #A0522D;
  --cabin-hearth-3: #B22222;
  --cabin-hearth-4: #D2B48C;
  --cabin-hearth-5: #5C4033;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cabin-hearth": {
        1: "#8B4513",
        2: "#A0522D",
        3: "#B22222",
        4: "#D2B48C",
        5: "#5C4033",
      }
    }
  }
}

Related searches

cabin hearth paletterustic wood colorscozy nature schemewarm earthy redautumn cabin design

Palette colors

Hex values

Color 1#8B4513
·
Color 2#A0522D
·
Color 3#B22222
·
Color 4#D2B48C
·
Color 5#5C4033
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.1:1Fail
3.6:1AA18
1.3:1Fail
2
1.3:1Fail
1.2:1Fail
2.8:1Fail
1.7:1Fail
3
1.1:1Fail
1.2:1Fail
3.4:1AA18
1.4:1Fail
4
3.6:1AA18
2.8:1Fail
3.4:1AA18
4.8:1AA
5
1.3:1Fail
1.7:1Fail
1.4:1Fail
4.8:1AA

Similar palettes

More like Cabin Hearth

View all warm