Palette

Ancient Amphora Clay

Subtle, aged earth tones that recall the rustic elegance of ancient clay amphorae and pottery.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#B0946E#C8AE8E#DDCAB4#E9DFD0#7B624A

Palette guide

How to use Ancient Amphora Clay

Overview

The 'Ancient Amphora Clay' palette offers a refined collection of subtle, aged earth tones, recalling the rustic elegance of ancient clay amphorae and pottery. This natural and grounding scheme features harmonious shades like the medium clay brown of #B0946E, the lighter #C8AE8E, and the near-white #E9DFD0. Anchored by the deep #7B624A, the palette provides a sense of history and handcrafted authenticity. It’s ideal for designs seeking a quiet sophistication, warmth, and organic appeal, perfect for creating a serene and timeless atmosphere.

Best used for

Pottery and ceramic brand identities
Minimalist interior design concepts
Natural product packaging (e.g., artisanal goods)
Historical documentary or exhibition design
Websites with a relaxed, natural theme
Artisanal craft fair branding

Suggested color roles

primary

Utilize #B0946E as a grounding primary color for headers, foundational elements, or large content blocks.

secondary

Apply #C8AE8E for supporting elements, subheadings, or as a softer background for visual breaks.

accent

Use #DDCAB4 for subtle highlights, delicate borders, or to add a touch of texture and lightness.

background

The clean, spacious #E9DFD0 makes an excellent background, providing a light and airy canvas.

text

For strong readability and an earthy feel, use #7B624A for body text and important information against lighter backgrounds.

Accessibility notes

Ensure sufficient contrast when using #7B624A or #B0946E for text on lighter shades like #DDCAB4 or #E9DFD0.
Avoid using #C8AE8E on #B0946E for small text sizes, as luminance contrast may be insufficient.
Interactive elements should use darker shades like #7B624A for clear distinction and accessibility.
Consider larger font sizes or bolding for text in lighter shades to improve readability.

Recommended combinations

Rustic Base

Forms a strong foundation for main content, providing excellent contrast and an authentic, earthy feel.

#7B624A · #B0946E · #C8AE8E

Soft Earthen

Ideal for soft backgrounds, subtle gradients, or layered elements that require a gentle, inviting presence.

#E9DFD0 · #DDCAB4 · #C8AE8E

Archeological Depth

Creates visual depth and hierarchy, suitable for displaying layered information or textured graphics.

#B0946E · #7B624A · #DDCAB4

CSS variables

:root {
  --ancient-amphora-clay-1: #B0946E;
  --ancient-amphora-clay-2: #C8AE8E;
  --ancient-amphora-clay-3: #DDCAB4;
  --ancient-amphora-clay-4: #E9DFD0;
  --ancient-amphora-clay-5: #7B624A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ancient-amphora-clay": {
        1: "#B0946E",
        2: "#C8AE8E",
        3: "#DDCAB4",
        4: "#E9DFD0",
        5: "#7B624A",
      }
    }
  }
}

Hex values

Color 1#B0946E

Color 2#C8AE8E

Color 3#DDCAB4

Color 4#E9DFD0

Color 5#7B624A

Accessibility

Contrast checker

1.4:1Fail

1.8:1Fail

2.2:1Fail

2:1Fail

1.4:1Fail

1.3:1Fail

1.6:1Fail

2.7:1Fail

1.8:1Fail

1.3:1Fail

1.2:1Fail

3.6:1AA18

2.2:1Fail

1.6:1Fail

1.2:1Fail

4.3:1AA18

2:1Fail

2.7:1Fail

3.6:1AA18

4.3:1AA18

Similar palettes

More like Ancient Amphora Clay