Back to palettes

Palette

Geologic Strata Clay

Represents the subtle beauty of natural rock and earth formations, layered over millennia.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Geologic Strata 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 Geologic Strata Clay.

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

Data visualization

#8C5E4A#AD7C65#D4B89D#5C433C#7B5E50

Palette guide

How to use Geologic Strata Clay

Overview

The Geologic Strata Clay palette beautifully represents the subtle beauty of natural rock and earth formations, layered over millennia. This organic scheme, featuring the grounding #8C5E4A, the warm #AD7C65, and the rich #5C433C, offers a sophisticated yet natural aesthetic. Designers can leverage #D4B89D for a soft, illuminating highlight and #7B5E50 as a balanced mid-tone, crafting designs that evoke authenticity, stability, and a deep connection to the earth. It is perfect for projects seeking a natural, understated elegance.

Best used for

  • Eco-friendly and sustainable brand identities
  • Natural product packaging (cosmetics, food)
  • Interior design and architectural renderings
  • Outdoor adventure and travel websites
  • Artisan craft and pottery businesses
  • Historical or anthropological content

Suggested color roles

primary

Utilize #5C433C for main content areas, headers, or strong graphic elements, providing a deep, stable foundation.

secondary

Employ #8C5E4A for supporting sections, subheadings, or background accents, maintaining a rich, earthy feel.

accent

Introduce #D4B89D as a soft highlight for key details, buttons, or delicate graphic elements, offering gentle contrast.

background

Use #D4B89D as a warm, inviting background, creating an open and natural canvas for content.

text

For optimal readability, use #5C433C or a dark charcoal for text on lighter backgrounds, or white/cream on darker hues.

Accessibility notes

  • Ensure sufficient contrast between #D4B89D backgrounds and darker text colors like #5C433C for WCAG AA compliance.
  • Avoid using #AD7C65 text on #D4B89D backgrounds, as the contrast may be too low for readability.
  • The mid-tone #7B5E50 can be used for text, but always verify its contrast against the chosen background.
  • Pay close attention to text legibility when using any of the medium-dark brown shades on each other; separate with lighter tones.

Recommended combinations

Earthy Foundation

Dark base for strong branding, light background, and a warm mid-tone for balanced content.

#5C433C · #D4B89D · #8C5E4A

Clay Layers

Excellent for creating natural gradients or layered graphics, mimicking geological strata with subtle variations.

#8C5E4A · #AD7C65 · #7B5E50

Organic Contrast

Light background with deep text, accented by a warm, supportive mid-tone, perfect for clean, natural designs.

#D4B89D · #5C433C · #AD7C65

CSS variables

:root {
  --geologic-strata-clay-1: #8C5E4A;
  --geologic-strata-clay-2: #AD7C65;
  --geologic-strata-clay-3: #D4B89D;
  --geologic-strata-clay-4: #5C433C;
  --geologic-strata-clay-5: #7B5E50;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "geologic-strata-clay": {
        1: "#8C5E4A",
        2: "#AD7C65",
        3: "#D4B89D",
        4: "#5C433C",
        5: "#7B5E50",
      }
    }
  }
}

Related searches

earth tone color palettenatural clay colorsgeologic strata designorganic brown palettesubtle earth hues

Palette colors

Hex values

Color 1#8C5E4A
·
Color 2#AD7C65
·
Color 3#D4B89D
·
Color 4#5C433C
·
Color 5#7B5E50
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.9:1Fail
1.6:1Fail
1.1:1Fail
2
1.5:1Fail
1.9:1Fail
2.5:1Fail
1.6:1Fail
3
2.9:1Fail
1.9:1Fail
4.8:1AA
3.1:1AA18
4
1.6:1Fail
2.5:1Fail
4.8:1AA
1.5:1Fail
5
1.1:1Fail
1.6:1Fail
3.1:1AA18
1.5:1Fail

Similar palettes

More like Geologic Strata Clay

View all earth
Botanical Sketch Green
Sedimentary Layered Stone
Agave Spire Dawn
Ancient Forest Hush
Ancient Forest Realm
Arid Blossom Mirage