Back to palettes

Palette

Terracotta Path Dust

The sun-warmed, dusty tones of an old terracotta path, inviting exploration with its natural, earthy feel.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Terracotta Path Dust 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 Terracotta Path Dust.

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

Data visualization

#CD853F#D2B48C#A0522D#8B4513#B8860B

Palette guide

How to use Terracotta Path Dust

Overview

The Terracotta Path Dust palette captures the inviting, sun-warmed essence of an old, natural pathway. Featuring earthy tones like the rich terracotta of #CD853F and the muted dustiness of #D2B48C, it evokes a sense of rustic charm and grounded tranquility. Designers and developers can leverage this palette for projects requiring a warm, natural feel, blending deeper browns such as #A0522D and #8B4513 with hints of golden warmth from #B8860B. It’s ideal for creating a comforting and authentic user experience, reminiscent of ancient landscapes and artisanal craftsmanship.

Best used for

  • Rustic brand identity and logos
  • Nature-themed websites or blogs
  • Interior design for cozy, earthy spaces
  • Packaging for organic or artisanal products
  • Digital art and illustration with natural themes
  • Educational materials on history or archaeology

Suggested color roles

primary

Use #CD853F as a dominant warm terracotta for main headers or key call-to-action buttons, conveying warmth and approachability.

secondary

Apply #D2B48C for background sections, supporting elements, or larger blocks of content to maintain a soft, dusty base.

accent

Introduce #B8860B for subtle highlights, interactive elements, or decorative details to add a touch of golden warmth and visual interest.

background

Utilize #D2B48C for light, inviting backgrounds, or pair with an off-white to create a spacious, airy feel.

text

Employ #8B4513 for primary body text and labels, ensuring excellent readability against lighter palette colors. For headings, #A0522D offers a slightly softer contrast.

Accessibility notes

  • Ensure sufficient contrast between #8B4513 text and lighter backgrounds like #D2B48C or a near-white for WCAG AA compliance.
  • Avoid placing light text on #B8860B; prefer darker text such as #A0522D for better legibility.
  • Icons and interactive elements using #CD853F should have a clear contrast against their surrounding background.
  • Consider using a bold font for headlines in #A0522D against #D2B48C to improve readability for all users.

Recommended combinations

Earthy Base

Ideal for content areas, with a light background, strong text, and a deep accent for emphasis.

#D2B48C · #A0522D · #8B4513

Warm Highlight

Perfect for hero sections or prominent features, combining primary warmth with golden accents.

#CD853F · #B8860B · #D2B48C

Rustic Depth

Creates a grounded and rich aesthetic, suitable for headers, footers, or impactful design elements.

#A0522D · #CD853F · #8B4513

CSS variables

:root {
  --terracotta-path-dust-1: #CD853F;
  --terracotta-path-dust-2: #D2B48C;
  --terracotta-path-dust-3: #A0522D;
  --terracotta-path-dust-4: #8B4513;
  --terracotta-path-dust-5: #B8860B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "terracotta-path-dust": {
        1: "#CD853F",
        2: "#D2B48C",
        3: "#A0522D",
        4: "#8B4513",
        5: "#B8860B",
      }
    }
  }
}

Related searches

earthy color schemesrustic web design palettewarm natural tonesterracotta brown hex codesdusty path colors

Palette colors

Hex values

Color 1#CD853F
·
Color 2#D2B48C
·
Color 3#A0522D
·
Color 4#8B4513
·
Color 5#B8860B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
1.9:1Fail
2.4:1Fail
1.1:1Fail
2
1.5:1Fail
2.8:1Fail
3.6:1AA18
1.7:1Fail
3
1.9:1Fail
2.8:1Fail
1.3:1Fail
1.7:1Fail
4
2.4:1Fail
3.6:1AA18
1.3:1Fail
2.2:1Fail
5
1.1:1Fail
1.7:1Fail
1.7:1Fail
2.2:1Fail

Similar palettes

More like Terracotta Path Dust

View all earth
Sunbaked Adobe Wall
Sunbaked Clay Pot
Adobe Sunset
Adobe Sunset Glow
Ancient Aegean Clay
Ancient Clay Vessel