Palette

Ancient Pottery

Earthy browns and warm terracottas reflect the natural beauty and timeless feel of ancient handcrafted pottery.

EarthNatural5 colors

More Earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ancient Pottery 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 Ancient Pottery.

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

Data visualization

#8B4513#A0522D#CD853F#D2B48C#DEB887

Palette guide

How to use Ancient Pottery

Overview

The Ancient Pottery palette celebrates earthy browns and warm terracottas, reflecting the natural beauty and timeless feel of ancient handcrafted pottery. With a rich progression from the deep #8B4513 and #A0522D to the versatile #CD853F, and the lighter #D2B48C and #DEB887, this palette exudes a natural and rustic mood. Designers can utilize these authentic hues to create designs that communicate tradition, warmth, and an organic, artisanal appeal, perfect for projects that value handcrafted aesthetics.

Best used for

Ceramic art branding and portfolios
Traditional craft website themes
Natural cosmetics packaging
Rustic interior design mood boards
Historical reenactment website design
Artisan food product marketing

Suggested color roles

primary

Utilize #8B4513 for main headings, important calls to action, or key navigational elements to provide strong visual anchors.

secondary

Employ #A0522D for subheadings, secondary buttons, or footer backgrounds, offering a deep, complementary brown.

accent

Introduce #CD853F sparingly for a vibrant, warm accent, drawing attention to interactive elements or key highlights.

background

Apply #DEB887 or #D2B48C as a clean, aged background, reminiscent of natural clay, providing excellent contrast for darker text.

text

For body text, #8B4513 offers optimal readability on lighter backgrounds like #DEB887, embodying the palette's rustic feel.

Accessibility notes

The contrast between #8B4513 and #DEB887 is excellent for text readability, meeting WCAG AAA standards.
Ensure sufficient contrast when using mid-tones like #CD853F or #A0522D for text, especially on other mid-range backgrounds.
Avoid using #DEB887 or #D2B48C for text on similar light backgrounds within the palette.
Consider using #A0522D for larger display text on #D2B48C, but always verify contrast for smaller sizes.

Recommended combinations

Handcrafted Clay

Perfect for a classic page layout: light background, a warmer mid-tone for sections, and a deep brown for readable text.

#DEB887 · #D2B48C · #8B4513

Earthy Terracotta

Creates a rich, layered effect suitable for hero sections or prominent content blocks, adding visual depth and character.

#CD853F · #A0522D · #8B4513

Rustic Warmth

Combines a clean background with a vibrant accent color and a deep brown for secondary elements or highlights.

#DEB887 · #CD853F · #A0522D

CSS variables

:root {
  --ancient-pottery-1: #8B4513;
  --ancient-pottery-2: #A0522D;
  --ancient-pottery-3: #CD853F;
  --ancient-pottery-4: #D2B48C;
  --ancient-pottery-5: #DEB887;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ancient-pottery": {
        1: "#8B4513",
        2: "#A0522D",
        3: "#CD853F",
        4: "#D2B48C",
        5: "#DEB887",
      }
    }
  }
}

Hex values

Color 1#8B4513

Color 2#A0522D

Color 3#CD853F

Color 4#D2B48C

Color 5#DEB887

Accessibility

Contrast checker

1.3:1Fail

2.4:1Fail

3.6:1AA18

3.8:1AA18

1.3:1Fail

1.9:1Fail

2.8:1Fail

3:1AA18

2.4:1Fail

1.9:1Fail

1.5:1Fail

1.6:1Fail

3.6:1AA18

2.8:1Fail

1.5:1Fail

1.1:1Fail

3.8:1AA18

3:1AA18

1.6:1Fail

1.1:1Fail

Similar palettes

More like Ancient Pottery

View all Earth

Warm Terracotta Earth

Bohemian Clay Road

Bohemian Earth Vessel

Bohemian Textile Blend

Desert Bloom Echo

Desert Clay Hearth