Back to palettes

Palette

Copper Canyon Wall

Rich, coppery tones and vibrant oranges evoke the sunbaked, textured walls of a vast canyon landscape.

warmnatural5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Copper Canyon Wall 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 Copper Canyon Wall.

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

Data visualization

#B87333#CD853F#D2691E#FF7F50#FFE4C4

Palette guide

How to use Copper Canyon Wall

Overview

The Copper Canyon Wall palette evokes the sunbaked, textured walls of a vast canyon, with its rich, coppery tones and vibrant oranges. Featuring classic #B87333, intense #D2691E, lively #FF7F50, and grounding #CD853F, complemented by the soft glow of #FFE4C4, this palette exudes natural warmth, rugged beauty, and a sense of enduring strength. Designers and developers can leverage these hex codes to create immersive, inviting, and robust interfaces, adventurous branding, or evocative digital experiences. It's an excellent choice for projects requiring a natural, earthy, or southwestern aesthetic, offering vibrant energy and a powerful sense of place.

Best used for

  • Outdoor adventure gear e-commerce
  • Southwestern cultural tourism websites
  • Rustic lodge or retreat branding
  • Desert-themed gaming interfaces
  • Natural beauty product packaging
  • Geology or nature education platforms

Suggested color roles

primary

Use #B87333 as a dominant, rich primary for headers, important buttons, or main sections.

secondary

Apply #CD853F for secondary content areas, navigation, or subtle textural elements.

accent

Introduce #FF7F50 as a vibrant, energetic accent for interactive elements or calls-to-action.

background

The very light #FFE4C4 provides a soft, warm background for optimal readability.

text

A deep brown (#5C3A33) or black (#000000) provides excellent contrast on lighter backgrounds, while white (#FFFFFF) works on darker tones.

Accessibility notes

  • Ensure sufficient contrast for text, especially when pairing mid-tones like #CD853F and #D2691E with text.
  • Text in dark brown on #FFE4C4 will be highly readable.
  • White text will be necessary for #B87333 and #D2691E to meet WCAG contrast standards.
  • The vibrant #FF7F50 will require very dark text or be used sparingly for accents to maintain readability.

Recommended combinations

Canyon Depths

Excellent for strong headers, footers, or defining robust sections in a natural theme.

#B87333 · #CD853F · #D2691E

Sunbaked Glow

Use for contrasting content blocks, subtle gradients, or warm, inviting backgrounds.

#D2691E · #FFE4C4 · #CD853F

Vibrant Earth

Ideal for layered backgrounds, textured elements, or a rich, energetic visual hierarchy.

#FF7F50 · #B87333 · #CD853F

CSS variables

:root {
  --copper-canyon-wall-1: #B87333;
  --copper-canyon-wall-2: #CD853F;
  --copper-canyon-wall-3: #D2691E;
  --copper-canyon-wall-4: #FF7F50;
  --copper-canyon-wall-5: #FFE4C4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "copper-canyon-wall": {
        1: "#B87333",
        2: "#CD853F",
        3: "#D2691E",
        4: "#FF7F50",
        5: "#FFE4C4",
      }
    }
  }
}

Related searches

copper canyon orange palettedesert wall hex codesnatural vibrant design colorssouthwestern earthy brand identitywarm textured UI colors

Palette colors

Hex values

Color 1#B87333
·
Color 2#CD853F
·
Color 3#D2691E
·
Color 4#FF7F50
·
Color 5#FFE4C4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1:1Fail
1.5:1Fail
3.1:1AA18
2
1.3:1Fail
1.2:1Fail
1.2:1Fail
2.4:1Fail
3
1:1Fail
1.2:1Fail
1.5:1Fail
3:1Fail
4
1.5:1Fail
1.2:1Fail
1.5:1Fail
2:1Fail
5
3.1:1AA18
2.4:1Fail
3:1Fail
2:1Fail

Similar palettes

More like Copper Canyon Wall

View all warm