Palette

Whispering Canyon Wall

Warm, subtle earth tones reflecting the ancient, sculpted beauty of canyon walls at twilight.

NeutralNatural5 colors

More Neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#D7CCC8#A1887F#795548#5D4037#4E342E

Palette guide

How to use Whispering Canyon Wall

Overview

The Whispering Canyon Wall palette presents a rich collection of warm, subtle earth tones, reflecting the ancient, sculpted beauty of canyon walls at twilight. Ranging from the soft #D7CCC8 to the deep #4E342E, this palette offers designers and developers a sophisticated foundation for creating inviting and grounded experiences. The mid-tone #795548 provides a strong, earthy anchor, while #A1887F adds supportive warmth. These hues are perfect for evoking a sense of natural beauty, history, and rugged elegance in various applications.

Best used for

Rustic branding and logos
Historical or cultural exhibit design
Cozy cafe and restaurant interiors
Sophisticated home decor accents
Wilderness adventure websites and apps
E-commerce for artisanal products

Suggested color roles

primary

#D7CCC8 acts as a light, warm neutral base, ideal for expansive backgrounds or canvas areas.

secondary

#A1887F provides a grounding, mid-tone support for content blocks or secondary navigation.

accent

#795548 offers a rich, earthy emphasis for important calls to action or key visual elements.

background

#D7CCC8 creates a soft, inviting canvas that allows other elements to stand out with warmth.

text

#4E342E delivers a deep, readable brown, ensuring clear and comfortable reading for body text.

Accessibility notes

Ensure #4E342E or #5D4037 is used for body text on lighter backgrounds like #D7CCC8 for optimal contrast.
Avoid using #D7CCC8 for small text elements, as its light value will result in low readability.
Check contrast ratios for interactive elements, especially when using #A1887F against similar mid-tones.
Use #795548 for larger headings or important information to provide visual weight and clarity.

Recommended combinations

Twilight Glow

For a balanced and warm aesthetic, suitable for hero sections, main content areas, or brand messaging.

#D7CCC8 · #A1887F · #795548

Deep Earth

To create visual depth and a strong, grounded feel, ideal for footers, navigation, or illustrative elements.

#795548 · #5D4037 · #4E342E

Warm Contrast

For clear hierarchy and distinction between elements, such as text on cards or feature highlights.

#D7CCC8 · #5D4037 · #A1887F

CSS variables

:root {
  --whispering-canyon-wall-2-1: #D7CCC8;
  --whispering-canyon-wall-2-2: #A1887F;
  --whispering-canyon-wall-2-3: #795548;
  --whispering-canyon-wall-2-4: #5D4037;
  --whispering-canyon-wall-2-5: #4E342E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "whispering-canyon-wall-2": {
        1: "#D7CCC8",
        2: "#A1887F",
        3: "#795548",
        4: "#5D4037",
        5: "#4E342E",
      }
    }
  }
}

Hex values

Color 1#D7CCC8

Color 2#A1887F

Color 3#795548

Color 4#5D4037

Color 5#4E342E

Accessibility

Contrast checker

2.1:1Fail

4.2:1AA18

5.9:1AA

7.2:1AAA

2.1:1Fail

2:1Fail

2.8:1Fail

3.4:1AA18

4.2:1AA18

2:1Fail

1.4:1Fail

1.7:1Fail

5.9:1AA

2.8:1Fail

1.4:1Fail

1.2:1Fail

7.2:1AAA

3.4:1AA18

1.7:1Fail

1.2:1Fail

Similar palettes

More like Whispering Canyon Wall

Desert Mesa Sculptures