Back to palettes

Palette

Coastal Clay Pottery

Earthy browns and soft grays inspired by handcrafted clay pottery found along a rugged coastline.

EarthNatural5 colors
More Earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#BCAAA4#8D6E63#795548#5D4037#A1887F

Palette guide

How to use Coastal Clay Pottery

Overview

The "Coastal Clay Pottery" palette offers a deeply grounding collection of earthy browns and warm neutrals, perfect for evoking a sense of handcrafted authenticity and rustic charm. With shades like the soft, muted beige of #BCAAA4 and the rich, deep chocolate of #5D4037, this palette is ideal for designers seeking to convey natural elegance. The mid-tones, including the warm brown of #8D6E63 and the slightly more reddish #795548, provide excellent depth, while #A1887F adds a touch of sun-baked warmth. This versatile range captures the essence of artisanal clay and weathered coastal elements, making it suitable for projects that value organic textures and a serene, inviting atmosphere.

Best used for

  • Artisan craft branding (pottery, textiles)
  • Rustic interior design concepts
  • Natural skincare and beauty packaging
  • E-commerce sites for handmade goods
  • Cozy café or restaurant branding
  • Sustainable fashion lookbooks

Suggested color roles

primary

Utilize #795548 as the dominant color for headings, main buttons, or large graphical elements to establish a warm, earthy foundation.

secondary

Employ #8D6E63 for supporting sections, subheadings, or background elements that need more presence than the primary background, offering a subtle contrast.

accent

Introduce #A1887F for call-to-action buttons, interactive elements, or small decorative details, providing a warm, inviting highlight.

background

Use the lightest shade, #BCAAA4, for clean, spacious backgrounds, allowing content to breathe and maintaining a natural, airy feel.

text

Apply #5D4037 for body text and navigation links, ensuring excellent readability against lighter backgrounds while maintaining the palette's earthy tone.

Accessibility notes

  • Ensure #5D4037 text has sufficient contrast against #BCAAA4 and #A1887F backgrounds for WCAG AA compliance.
  • Avoid using #BCAAA4 and #A1887F for text on white or very light backgrounds without careful contrast checking.
  • For interactive elements, ensure hover/focus states provide clear visual distinction beyond just color changes.
  • Consider using a slightly darker charcoal for critical small text if #5D4037 doesn't pass contrast on certain light shades.

Recommended combinations

Earthy Foundation

Ideal for core UI elements: dark text on a light background with a strong primary color for accents or banners.

#795548 · #BCAAA4 · #5D4037

Rustic Warmth

Perfect for creating a cozy, inviting atmosphere in hero sections or feature blocks, using the lighter shade as a soft background.

#8D6E63 · #A1887F · #BCAAA4

Deep Clay

Best for rich, deep sections or footers where a sense of grounded stability and warmth is desired.

#5D4037 · #795548 · #8D6E63

CSS variables

:root {
  --coastal-clay-pottery-1: #BCAAA4;
  --coastal-clay-pottery-2: #8D6E63;
  --coastal-clay-pottery-3: #795548;
  --coastal-clay-pottery-4: #5D4037;
  --coastal-clay-pottery-5: #A1887F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "coastal-clay-pottery": {
        1: "#BCAAA4",
        2: "#8D6E63",
        3: "#795548",
        4: "#5D4037",
        5: "#A1887F",
      }
    }
  }
}

Related searches

earth tone color schemesrustic brown color paletteclay pottery hex codesnatural coastal design colorswarm neutral web design

Palette colors

Hex values

Color 1#BCAAA4
·
Color 2#8D6E63
·
Color 3#795548
·
Color 4#5D4037
·
Color 5#A1887F
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.1:1Fail
2.9:1Fail
4.2:1AA18
1.5:1Fail
2
2.1:1Fail
1.4:1Fail
2:1Fail
1.4:1Fail
3
2.9:1Fail
1.4:1Fail
1.4:1Fail
2:1Fail
4
4.2:1AA18
2:1Fail
1.4:1Fail
2.8:1Fail
5
1.5:1Fail
1.4:1Fail
2:1Fail
2.8:1Fail

Similar palettes

More like Coastal Clay Pottery

View all Earth
Earthenware Rustic Bake
Ancient Pottery
Bohemian Clay Road
Bohemian Earth Vessel
Desert Canyon Clay
Desert Clay Hearth