Back to palettes

Palette

Sedimentary Layered Stone

Reflects the natural beauty of stratified rock formations, showcasing warm earth tones and subtle contrasts.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sedimentary Layered Stone 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 Sedimentary Layered Stone.

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

Data visualization

#A0522D#CD853F#D2B48C#8B4513#708090

Palette guide

How to use Sedimentary Layered Stone

Overview

The "Sedimentary Layered Stone" palette evokes the rugged beauty of natural rock formations, offering a harmonious blend of warm earth tones and subtle cool contrasts. Featuring rich hues like Sienna (#A0522D) and Saddle Brown (#8B4513), balanced by the softer Peru (#CD853F) and Tan (#D2B48C), this collection provides a grounding aesthetic. The inclusion of Slate Gray (#708090) introduces a sophisticated, cool undertone, preventing the palette from becoming overly monochromatic. Ideal for projects seeking an organic, authentic, or rustic feel, it allows for depth and visual interest without sacrificing warmth. Designers can leverage these colors to create a sense of stability and natural elegance in various digital and physical applications, ensuring a cohesive and inviting user experience.

Best used for

  • Rustic interior design branding
  • Eco-friendly product packaging
  • Outdoor adventure website themes
  • Natural skincare or cosmetic branding
  • Coffee shop or artisanal food branding
  • Historical or geological museum exhibits

Suggested color roles

primary

Use #8B4513 (Saddle Brown) as a deep, grounding color for main sections, headers, or large content blocks, conveying stability and strength.

secondary

Employ #A0522D (Sienna) as a rich, warm supporting color, excellent for subheadings, key graphical elements, or as a strong brand identifier.

accent

Apply #CD853F (Peru) for calls-to-action, interactive elements, or to highlight key information, leveraging its brighter, more vibrant quality.

background

Utilize #D2B48C (Tan) as a soft, neutral background, providing a gentle base that allows other elements to stand out without overwhelming the viewer.

text

Choose #708090 (Slate Gray) for body text, offering a sophisticated, dark gray that ensures excellent readability against lighter backgrounds, or use a near-black for stronger contrast.

Accessibility notes

  • Ensure sufficient contrast between #708090 (Slate Gray) text and #D2B48C (Tan) background for optimal readability, especially for body copy.
  • Avoid using #CD853F (Peru) directly as text on #D2B48C (Tan) for small fonts, as the contrast might be insufficient for WCAG AA compliance.
  • For interactive elements like buttons, ensure the accent color #CD853F has a strong contrast with its text (e.g., using charcoal or near-black).
  • Reserve #8B4513 (Saddle Brown) and #A0522D (Sienna) for larger headings or graphical elements when placed on lighter backgrounds to maintain legibility.

Recommended combinations

Earthy Foundation

Ideal for website main content areas where #D2B48C serves as the background, #8B4513 for prominent headings, and #708090 for body text.

#D2B48C · #8B4513 · #708090

Warm Accents

Use #A0522D for section dividers or secondary elements, #CD853F for impactful call-to-action buttons, and #D2B48C as a light, inviting background.

#A0522D · #CD853F · #D2B48C

Layered Depth

Effective for creating visual hierarchy in dashboards or infographics, using #8B4513 for primary data, #A0522D for secondary, and #708090 for labels or descriptions.

#8B4513 · #A0522D · #708090

CSS variables

:root {
  --sedimentary-layered-stone-1: #A0522D;
  --sedimentary-layered-stone-2: #CD853F;
  --sedimentary-layered-stone-3: #D2B48C;
  --sedimentary-layered-stone-4: #8B4513;
  --sedimentary-layered-stone-5: #708090;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sedimentary-layered-stone": {
        1: "#A0522D",
        2: "#CD853F",
        3: "#D2B48C",
        4: "#8B4513",
        5: "#708090",
      }
    }
  }
}

Related searches

earth tone color schemerustic natural palettegeology inspired colorsbrown gray color combinationorganic earthy design

Palette colors

Hex values

Color 1#A0522D
·
Color 2#CD853F
·
Color 3#D2B48C
·
Color 4#8B4513
·
Color 5#708090
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
2.8:1Fail
1.3:1Fail
1.4:1Fail
2
1.9:1Fail
1.5:1Fail
2.4:1Fail
1.4:1Fail
3
2.8:1Fail
1.5:1Fail
3.6:1AA18
2.1:1Fail
4
1.3:1Fail
2.4:1Fail
3.6:1AA18
1.8:1Fail
5
1.4:1Fail
1.4:1Fail
2.1:1Fail
1.8:1Fail

Similar palettes

More like Sedimentary Layered Stone

View all earth
Aged Wood Stain
Ancient Clay Vessel
Bohemian Earth Weave
Bohemian Loom Tapestry
Canyon Clay Whisper
Canyon Wall Terracotta