Palette

Earthen Clay Pot

Rich, natural hues mirroring the robust and organic texture of hand-thrown clay pottery.

EarthNatural5 colors

More Earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Earthen Clay Pot 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 Earthen Clay Pot.

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

Data visualization

#CD853F#A0522D#8B4513#BDB76B#D2B48C

Palette guide

How to use Earthen Clay Pot

Overview

The Earthen Clay Pot palette presents rich, natural hues mirroring the robust and organic texture of hand-thrown clay pottery. Featuring warm browns and oranges like #CD853F and #A0522D, it includes deeper tones such as #8B4513 and #BDB76B, with #D2B48C adding a soft, sandy beige. This palette is ideal for designers and developers seeking to create natural, rustic, and authentic experiences. It's versatile for conveying craftsmanship, warmth, and an organic feel across web interfaces, branding, and physical product designs, particularly those with an artisanal or natural aesthetic.

Best used for

Handmade pottery branding
Rustic home goods e-commerce
Artisan food packaging
Eco-friendly product lines
Traditional craft websites
Farm-to-table restaurant branding

Suggested color roles

primary

#CD853F - A warm, inviting clay orange-brown, excellent for primary UI elements or brand accents.

secondary

#A0522D - A rich, reddish-brown, ideal for supporting content or secondary highlights.

accent

#8B4513 - The deepest, most grounding saddle brown, perfect for impactful accents or calls-to-action.

background

#D2B48C - The lightest, sandy beige, providing a soft and natural canvas.

text

#8B4513 - A deep, readable saddle brown, ensuring strong contrast on lighter palette colors.

Accessibility notes

Ensure #8B4513 or #A0522D is used for text on #D2B48C or #CD853F to meet WCAG contrast guidelines.
Avoid using #BDB76B for text on #CD853F due to insufficient contrast.
The darkest shades provide excellent contrast for text on any of the lighter palette colors.
Test all text/background color pairs with WCAG 2.1 AA guidelines, especially for small text.

Recommended combinations

Clay & Sand

Soft, warm background gradients or layered visual effects evoking natural materials.

#D2B48C · #CD853F · #A0522D

Artisan Contrast

High-contrast headings, buttons, or key information against a clean, light backdrop.

#8B4513 · #D2B48C · #A0522D

Rustic Blend

Creating balanced content blocks or decorative elements with an organic, handmade feel.

#A0522D · #BDB76B · #CD853F

CSS variables

:root {
  --earthen-clay-pot-2-1: #CD853F;
  --earthen-clay-pot-2-2: #A0522D;
  --earthen-clay-pot-2-3: #8B4513;
  --earthen-clay-pot-2-4: #BDB76B;
  --earthen-clay-pot-2-5: #D2B48C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "earthen-clay-pot-2": {
        1: "#CD853F",
        2: "#A0522D",
        3: "#8B4513",
        4: "#BDB76B",
        5: "#D2B48C",
      }
    }
  }
}

Hex values

Color 1#CD853F

Color 2#A0522D

Color 3#8B4513

Color 4#BDB76B

Color 5#D2B48C

Accessibility

Contrast checker

1.9:1Fail

2.4:1Fail

1.4:1Fail

1.5:1Fail

1.9:1Fail

1.3:1Fail

2.7:1Fail

2.8:1Fail

2.4:1Fail

1.3:1Fail

3.4:1AA18

3.6:1AA18

1.4:1Fail

2.7:1Fail

3.4:1AA18

1:1Fail

1.5:1Fail

2.8:1Fail

3.6:1AA18

1:1Fail

Similar palettes

More like Earthen Clay Pot

View all Earth

Rustic Barnwood Tones