Palette

Warm Terracotta Earth

Deep, sun-baked earth tones radiating a comforting warmth and grounded stability.

EarthNatural5 colors

More Earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Warm Terracotta Earth 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 Warm Terracotta Earth.

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

Data visualization

#8B4513#A0522D#CD853F#D2B48C#FAEBD7

Palette guide

How to use Warm Terracotta Earth

Overview

The Warm Terracotta Earth palette evokes a comforting, grounded stability with its rich, sun-baked tones. Featuring a deep saddle brown (#8B4513), a vibrant sienna terracotta (#A0522D), and a warm peru (#CD853F), this collection is perfect for designs seeking a natural, rustic feel. The lighter tan (#D2B48C) and creamy antique white (#FAEBD7) provide essential contrast and breathability, allowing for sophisticated layering. Designers and developers can leverage these hues to create inviting digital experiences, robust branding, or cozy interior aesthetics that resonate with authenticity and warmth. Its earthy core makes it highly versatile for conveying organic strength.

Best used for

Rustic or bohemian interior design themes
Branding for natural skincare, organic food, or artisanal crafts
Websites and apps aiming for a warm, inviting, and trustworthy feel
Editorial layouts for travel, nature, or culinary content
Packaging for handcrafted goods and eco-friendly products
Fashion and apparel collections with an earthy, comfortable aesthetic

Suggested color roles

primary

Use #A0522D (Sienna) as a foundational color for large sections, headlines, or brand identity, providing a strong terracotta presence.

secondary

Employ #8B4513 (Saddle Brown) for deep contrast, important navigation elements, or as a rich background to ground the design.

accent

Apply #CD853F (Peru) sparingly for calls-to-action, interactive elements, or graphic highlights to add a warm, energetic pop.

background

Utilize #D2B48C (Tan) for main content areas or softer backgrounds, offering a light, neutral, and breathable canvas.

text

For dark text on light backgrounds, #8B4513 (Saddle Brown) offers excellent readability. For light text on dark backgrounds, #FAEBD7 (Antique White) provides clear contrast.

Accessibility notes

Ensure sufficient contrast between #FAEBD7 (Antique White) and darker hues like #8B4513 or #A0522D for text readability.
Avoid using mid-tone colors such as #CD853F for small text on backgrounds like #D2B48C, as contrast may be insufficient.
When pairing #D2B48C with #A0522D, especially for text, verify WCAG AA compliance to ensure legibility.
For interactive elements, maintain a clear visual hierarchy and ensure active states have distinct contrast changes.

Recommended combinations

Rustic Elegance

Ideal for high-contrast branding, sophisticated natural product packaging, or bold website headers.

#8B4513 · #A0522D · #FAEBD7

Sunny Clay

Excellent for warm, inviting layouts in cafes, craft stores, or web sections emphasizing warmth and creativity.

#A0522D · #CD853F · #D2B48C

Soft Earth

Perfect for gentle, breathable designs requiring strong text contrast, such as blog content or soft landing pages.

#D2B48C · #FAEBD7 · #8B4513

CSS variables

:root {
  --warm-terracotta-earth-1: #8B4513;
  --warm-terracotta-earth-2: #A0522D;
  --warm-terracotta-earth-3: #CD853F;
  --warm-terracotta-earth-4: #D2B48C;
  --warm-terracotta-earth-5: #FAEBD7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "warm-terracotta-earth": {
        1: "#8B4513",
        2: "#A0522D",
        3: "#CD853F",
        4: "#D2B48C",
        5: "#FAEBD7",
      }
    }
  }
}

Hex values

Color 1#8B4513

Color 2#A0522D

Color 3#CD853F

Color 4#D2B48C

Color 5#FAEBD7

Accessibility

Contrast checker

1.3:1Fail

2.4:1Fail

3.6:1AA18

6.1:1AA

1.3:1Fail

1.9:1Fail

2.8:1Fail

4.8:1AA

2.4:1Fail

1.9:1Fail

1.5:1Fail

2.6:1Fail

3.6:1AA18

2.8:1Fail

1.5:1Fail

1.7:1Fail

6.1:1AA

4.8:1AA

2.6:1Fail

1.7:1Fail

Similar palettes

More like Warm Terracotta Earth

View all Earth

Ancient Pottery

Bohemian Clay Road

Bohemian Earth Vessel

Bohemian Textile Blend

Desert Bloom Echo

Desert Clay Hearth