Back to palettes

Palette

Canyon Clay Formations

Earthy, rugged tones reflecting the layered rock and sunbaked clay of a deep canyon.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Canyon Clay Formations 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 Canyon Clay Formations.

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

Data visualization

#6A390C#8C471C#AF5E2C#D87F4A#F5A172

Palette guide

How to use Canyon Clay Formations

Overview

The "Canyon Clay Formations" palette presents a robust spectrum of earthy, rugged tones, perfect for designs inspired by natural landscapes. Ranging from the deep, grounding brown of #6A390C to the soft, sandy peach of #F5A172, this palette offers substantial versatility. The mid-tones, like the rich #8C471C, the inviting #AF5E2C, and the vibrant #D87F4A, provide excellent opportunities for layering and creating depth. This collection is particularly suited for projects that aim to convey durability, authenticity, and a connection to nature, making it a strong choice for outdoor brands or artisanal themes.

Best used for

  • Outdoor adventure brand websites
  • E-commerce for hiking gear or camping equipment
  • Natural history museum exhibit design
  • Rustic event invitations or stationery
  • Architectural visualization for desert homes
  • Branding for artisanal coffee or craft breweries

Suggested color roles

primary

Use #6A390C as a strong foundational color for headers, footers, or main navigation, conveying stability and depth.

secondary

Apply #AF5E2C for prominent elements like call-to-action buttons or key sections, adding warmth and approachability.

accent

Utilize #D87F4A for highlights, interactive elements, or small graphic details to draw immediate attention.

background

The lighter #F5A172 works well as a soft, inviting background, providing a neutral canvas for darker content.

text

For primary text, a deep brown like #6A390C or a dark charcoal offers excellent contrast against lighter backgrounds.

Accessibility notes

  • Ensure high contrast when pairing #F5A172 with text; darker palette colors or black are recommended.
  • Avoid using #D87F4A for small text on light backgrounds without checking WCAG contrast ratios.
  • The dark tones #6A390C and #8C471C provide good contrast for light text, improving readability.
  • Consider using a slightly desaturated version of #AF5E2C for less critical text to maintain readability.

Recommended combinations

Deep Earth

Excellent for creating a grounded, sophisticated feel in headers or strong visual blocks.

#6A390C · #8C471C · #AF5E2C

Desert Glow

Ideal for backgrounds with lighter accents, evoking a warm, sunlit atmosphere.

#F5A172 · #D87F4A · #AF5E2C

Rugged Contrast

Effective for high-contrast sections, with #6A390C as text on #F5A172, highlighted by #D87F4A.

#6A390C · #D87F4A · #F5A172

CSS variables

:root {
  --canyon-clay-formations-1: #6A390C;
  --canyon-clay-formations-2: #8C471C;
  --canyon-clay-formations-3: #AF5E2C;
  --canyon-clay-formations-4: #D87F4A;
  --canyon-clay-formations-5: #F5A172;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "canyon-clay-formations": {
        1: "#6A390C",
        2: "#8C471C",
        3: "#AF5E2C",
        4: "#D87F4A",
        5: "#F5A172",
      }
    }
  }
}

Related searches

rugged earth tonesdesert landscape colorsnatural brown orange paletteoutdoor brand color schemeclay formation hex codes

Palette colors

Hex values

Color 1#6A390C
·
Color 2#8C471C
·
Color 3#AF5E2C
·
Color 4#D87F4A
·
Color 5#F5A172
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2:1Fail
3.2:1AA18
4.6:1AA
2
1.4:1Fail
1.5:1Fail
2.3:1Fail
3.4:1AA18
3
2:1Fail
1.5:1Fail
1.6:1Fail
2.3:1Fail
4
3.2:1AA18
2.3:1Fail
1.6:1Fail
1.4:1Fail
5
4.6:1AA
3.4:1AA18
2.3:1Fail
1.4:1Fail

Similar palettes

More like Canyon Clay Formations

View all earth