Palette

Rustic Fable

Warm, organic browns and ochres tell a timeless story of nature and cozy, weathered comfort.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Rustic Fable 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 Rustic Fable.

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

Data visualization

#A0522D#CD853F#D2B48C#BC8F8F#8B4513

Palette guide

How to use Rustic Fable

Overview

The Rustic Fable palette weaves a timeless story with warm, organic browns and ochres, complemented by a unique touch of muted rose. Featuring the rich terracotta of #A0522D, the inviting ochre of #CD853F, and a deep, grounding brown #8B4513, this collection evokes a sense of nature and cozy, weathered comfort. A light tan, #D2B48C, provides a soft backdrop, while the subtle rose hue of #BC8F8F adds a touch of antiquated charm. Designers will find these hex codes ideal for projects that require a narrative depth, vintage appeal, or a handcrafted feel. Developers can implement this palette to create interfaces that feel authentic, warm, and imbued with a sense of history and storytelling.

Best used for

Storytelling platforms and blogs
Historical fiction book covers
Vintage apparel and accessory brands
Heritage craft product branding
Cozy home interior design themes
Educational content on folklore or history

Suggested color roles

primary

Utilize #CD853F as a warm, inviting primary color for main content areas or large sections, setting a cozy tone.

secondary

The rich terracotta #A0522D works well for secondary headings, call-to-action buttons, or illustrations, adding a touch of rustic warmth.

accent

Employ #BC8F8F as a unique accent for highlights, decorative elements, or to introduce a subtle, antique-rose charm.

background

The light tan #D2B48C serves as an excellent, soft background, providing a neutral canvas that allows other colors to tell their story.

text

For optimal readability, use the deep brown #8B4513 or a classic black for body text against lighter backgrounds like #D2B48C.

Accessibility notes

Ensure sufficient contrast between #D2B48C and text, especially when using #CD853F or #A0522D for smaller fonts.
The deep #8B4513 provides excellent contrast for text on #D2B48C; prioritize this pairing for critical information.
Exercise caution when using #BC8F8F for text, as its muted tone may not always meet WCAG contrast requirements on certain backgrounds.
When designing interactive elements, ensure clear visual feedback for states (hover, active) using contrasting colors from the palette.

Recommended combinations

Old World Charm

Creates a classic, grounded aesthetic, suitable for vintage-inspired branding or traditional websites.

#CD853F · #D2B48C · #8B4513

Fable Rose

Excellent for adding a delicate, storied touch to designs, perfect for accents or softer graphic elements.

#BC8F8F · #D2B48C · #A0522D

Rustic Depth

Ideal for creating strong visual hierarchy and depth in UI design, emphasizing important content.

#A0522D · #8B4513 · #CD853F

CSS variables

:root {
  --rustic-fable-1: #A0522D;
  --rustic-fable-2: #CD853F;
  --rustic-fable-3: #D2B48C;
  --rustic-fable-4: #BC8F8F;
  --rustic-fable-5: #8B4513;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "rustic-fable": {
        1: "#A0522D",
        2: "#CD853F",
        3: "#D2B48C",
        4: "#BC8F8F",
        5: "#8B4513",
      }
    }
  }
}

Hex values

Color 1#A0522D

Color 2#CD853F

Color 3#D2B48C

Color 4#BC8F8F

Color 5#8B4513

Accessibility

Contrast checker

1.9:1Fail

2.8:1Fail

2:1Fail

1.3:1Fail

1.9:1Fail

1.5:1Fail

1.1:1Fail

2.4:1Fail

2.8:1Fail

1.5:1Fail

1.4:1Fail

3.6:1AA18

2:1Fail

1.1:1Fail

1.4:1Fail

2.5:1Fail

1.3:1Fail

2.4:1Fail

3.6:1AA18

2.5:1Fail

Similar palettes

More like Rustic Fable

Rustic Barnwood Charm

Rustic Cabin Hideaway

Rustic Hearth Stone