Back to palettes

Palette

Fiery Canyon Walls

Inspired by the sun-baked, ochre walls of a grand canyon at the height of noon.

warmenergetic5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Fiery Canyon Walls 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 Fiery Canyon Walls.

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

Data visualization

#8B4513#A0522D#D2691E#FF4500#692E0F

Palette guide

How to use Fiery Canyon Walls

Overview

The Fiery Canyon Walls palette draws inspiration from the sun-baked, ochre walls of a grand canyon. This robust collection features deep, earthy browns like #8B4513 and #692E0F, rich oranges such as #A0522D and #D2691E, culminating in a striking fiery red #FF4500. It offers designers and developers a grounded yet energetic set of hues, perfect for conveying strength, warmth, and natural beauty. The palette's dramatic contrast and earthy tones make it highly versatile for creating immersive digital experiences or impactful brand identities with a rugged appeal.

Best used for

  • outdoor adventure branding
  • rustic interior design concepts
  • web design for nature themes
  • gaming environments and textures
  • cultural heritage presentations
  • dramatic photography backdrops

Suggested color roles

primary

#D2691E for main headings, large buttons, or dominant visual elements.

secondary

#A0522D for subheadings, navigation, or secondary content areas.

accent

#FF4500 to draw immediate attention, ideal for calls to action or alerts.

background

#8B4513 for a deep, grounding background, or #692E0F for a darker, more intense base.

text

Use white or a very light cream for text on darker shades like #8B4513, and a dark charcoal for lighter backgrounds.

Accessibility notes

  • White text will provide excellent contrast against #8B4513, #A0522D, and #692E0F.
  • Ensure #FF4500 text on #D2691E or #A0522D backgrounds meets contrast requirements.
  • Avoid using #A0522D directly on #8B4513 for small text; increase size if necessary.
  • Consider a slightly off-white or light beige for text on #D2691E for better readability than pure white.

Recommended combinations

Canyon Sunset

Creates a powerful gradient for headers or illustrative elements, depicting a dramatic sunset.

#8B4513 · #D2691E · #FF4500

Earthy Depth

Provides a rich, stable base for backgrounds and foundational design elements.

#692E0F · #A0522D · #8B4513

Vivid Contrast

Use for UI cards or sections where a dark base needs a vibrant, fiery accent.

#692E0F · #D2691E · #FF4500

CSS variables

:root {
  --fiery-canyon-walls-1: #8B4513;
  --fiery-canyon-walls-2: #A0522D;
  --fiery-canyon-walls-3: #D2691E;
  --fiery-canyon-walls-4: #FF4500;
  --fiery-canyon-walls-5: #692E0F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "fiery-canyon-walls": {
        1: "#8B4513",
        2: "#A0522D",
        3: "#D2691E",
        4: "#FF4500",
        5: "#692E0F",
      }
    }
  }
}

Related searches

canyon color paletteearthy red orange colorsdramatic warm paletterustic desert huessouthwestern color scheme

Palette colors

Hex values

Color 1#8B4513
·
Color 2#A0522D
·
Color 3#D2691E
·
Color 4#FF4500
·
Color 5#692E0F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
2:1Fail
2.1:1Fail
1.5:1Fail
2
1.3:1Fail
1.5:1Fail
1.6:1Fail
1.9:1Fail
3
2:1Fail
1.5:1Fail
1.1:1Fail
2.9:1Fail
4
2.1:1Fail
1.6:1Fail
1.1:1Fail
3.1:1AA18
5
1.5:1Fail
1.9:1Fail
2.9:1Fail
3.1:1AA18

Similar palettes

More like Fiery Canyon Walls

View all warm