Back to palettes

Palette

Coastal Clay Harvest

Warm, inviting shades of terracotta and dried clay, reflecting a bountiful coastal harvest.

WarmNatural5 colors
More Warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#8B5F42#B57F5A#D4A88E#F5D7C3#A06C50

Palette guide

How to use Coastal Clay Harvest

Overview

The Coastal Clay Harvest palette presents warm, inviting shades of terracotta and dried clay, reflecting a bountiful coastal harvest. This earthy collection ranges from the light, creamy #F5D7C3 to the deep, grounding #8B5F42 (Dark Salmon), evoking warmth, nature, and rustic charm. Designers can leverage these hex codes for artisanal branding, cozy digital experiences, or natural print materials. Developers will find these harmonious tones excellent for building user interfaces that feel organic, inviting, and rich in character, with #B57F5A providing a balanced mid-tone and #D4A88E offering a soft, expansive background.

Best used for

  • artisanal crafts and pottery
  • organic food brands
  • rustic home decor
  • autumnal event branding
  • farm-to-table restaurants
  • natural beauty products

Suggested color roles

primary

#B57F5A - A warm, earthy terracotta, excellent for main headings, primary navigation, or prominent natural brand elements.

secondary

#D4A88E - A lighter, supportive clay pink, perfect for subheadings, background panels, or supportive graphics.

accent

#8B5F42 - The deepest, darkest brown-orange, ideal for strong accents, important links, or focal points that require high contrast and warmth.

background

#F5D7C3 - The lightest, creamy peach, providing a clean, warm, and expansive canvas.

text

#A06C50 - This deep, rich brown offers excellent readability for body text against the lighter backgrounds like #F5D7C3 or #D4A88E.

Accessibility notes

  • Text in #A06C50 or #8B5F42 on backgrounds like #F5D7C3 or #D4A88E should meet WCAG AA contrast standards.
  • Avoid using lighter shades like #B57F5A or #D4A88E for small text on the lightest background #F5D7C3 due to potential low contrast.
  • Ensure interactive elements have clear visual feedback beyond just color, especially for mid-tone browns.
  • Always verify contrast ratios for all text and interactive elements, particularly for critical information.

Recommended combinations

Harvest Layers

For creating soft, layered backgrounds or inviting card designs, evoking natural textures.

#F5D7C3 · #D4A88E · #B57F5A

Earthy Depth

Ideal for professional layouts, using the deeper browns for headlines and lighter tones for content.

#8B5F42 · #A06C50 · #F5D7C3

Terracotta Blend

For content blocks or subtle dividers, maintaining a rich and harmonious visual flow with natural depth.

#B57F5A · #D4A88E · #A06C50

CSS variables

:root {
  --coastal-clay-harvest-1: #8B5F42;
  --coastal-clay-harvest-2: #B57F5A;
  --coastal-clay-harvest-3: #D4A88E;
  --coastal-clay-harvest-4: #F5D7C3;
  --coastal-clay-harvest-5: #A06C50;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "coastal-clay-harvest": {
        1: "#8B5F42",
        2: "#B57F5A",
        3: "#D4A88E",
        4: "#F5D7C3",
        5: "#A06C50",
      }
    }
  }
}

Related searches

coastal clay paletteterracotta warm colorsearthy harvest brandingrustic natural UIautumnal brown orange scheme

Palette colors

Hex values

Color 1#8B5F42
·
Color 2#B57F5A
·
Color 3#D4A88E
·
Color 4#F5D7C3
·
Color 5#A06C50
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.6:1Fail
4:1AA18
1.2:1Fail
2
1.6:1Fail
1.6:1Fail
2.5:1Fail
1.3:1Fail
3
2.6:1Fail
1.6:1Fail
1.6:1Fail
2.1:1Fail
4
4:1AA18
2.5:1Fail
1.6:1Fail
3.2:1AA18
5
1.2:1Fail
1.3:1Fail
2.1:1Fail
3.2:1AA18

Similar palettes

More like Coastal Clay Harvest

View all Warm
Sun-Drenched Terracotta
Harvest Season Charm
Harvest Sundown Hearth
Autumn Foliage Charm
Boho Sunloom Weave
Medieval Tapestry Aged