Palette

Urban Rust Echo

Reflects the weathered textures and warm muted tones of aged metal and urban decay.

neutralminimal5 colors

More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Urban Rust Echo 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 Urban Rust Echo.

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

Data visualization

#5C4A42#8E6C60#C29B8C#A78377#6F5B54

Palette guide

How to use Urban Rust Echo

Overview

The Urban Rust Echo palette offers a sophisticated take on weathered textures and warm muted tones, reminiscent of aged metal and urban decay. Featuring a spectrum from deep cocoa #5C4A42 to a soft, almost rosy #C29B8C, alongside an earthy #8E6C60 and a gentle #A78377, this palette provides versatility for designers seeking a subtle industrial or vintage feel. The grounding #6F5B54 ties these muted hues together, making it perfect for creating designs that feel established, warm, and subtly distressed without being overly harsh.

Best used for

Heritage brand identity
Sophisticated interior design concepts
Natural and organic product packaging
Vintage-inspired web layouts
Soft industrial photography backdrops
Historical or documentary film branding

Suggested color roles

primary

Utilize #5C4A42 as the primary anchor, offering a deep, warm brown-gray for backgrounds and main content areas.

secondary

Apply #8E6C60 for secondary content, sections, or subtle accents, providing an earthy, mid-tone warmth.

accent

Introduce #C29B8C or #A78377 for gentle highlights, buttons, or calls to action, softening the overall mood.

background

The muted #6F5B54 serves as an excellent soft background, or use #C29B8C for lighter, airy sections.

text

For optimal readability, use a dark brown like #5C4A42 or a deep charcoal for body text against lighter backgrounds.

Accessibility notes

Ensure sufficient contrast between text and background, especially when using similar mid-tones like #8E6C60 and #A78377.
For body text on lighter shades like #C29B8C, use a dark, high-contrast color such as #5C4A42.
If using #5C4A42 or #6F5B54 as backgrounds, ensure text is light (e.g., off-white or #C29B8C) for readability.
Avoid low contrast pairings for interactive elements; ensure they visually stand out from their surroundings.

Recommended combinations

Muted Warmth

Creates a soft, inviting atmosphere with a deep base, a light highlight, and a grounding mid-tone.

#5C4A42 · #C29B8C · #6F5B54

Earthy Depth

Highlights the rich, earthy browns, suitable for conveying natural or rustic aesthetics.

#8E6C60 · #A78377 · #5C4A42

Soft Industrial

Blends muted gray with soft rust tones, perfect for a subtle, sophisticated industrial feel.

#6F5B54 · #C29B8C · #8E6C60

CSS variables

:root {
  --urban-rust-echo-2-1: #5C4A42;
  --urban-rust-echo-2-2: #8E6C60;
  --urban-rust-echo-2-3: #C29B8C;
  --urban-rust-echo-2-4: #A78377;
  --urban-rust-echo-2-5: #6F5B54;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-rust-echo-2": {
        1: "#5C4A42",
        2: "#8E6C60",
        3: "#C29B8C",
        4: "#A78377",
        5: "#6F5B54",
      }
    }
  }
}

Hex values

Color 1#5C4A42

Color 2#8E6C60

Color 3#C29B8C

Color 4#A78377

Color 5#6F5B54

Accessibility

Contrast checker

1.8:1Fail

3.3:1AA18

2.4:1Fail

1.3:1Fail

1.8:1Fail

1.9:1Fail

1.4:1Fail

3.3:1AA18

1.9:1Fail

1.4:1Fail

2.5:1Fail

2.4:1Fail

1.4:1Fail

1.9:1Fail

1.3:1Fail

1.4:1Fail

2.5:1Fail

1.9:1Fail

Similar palettes

More like Urban Rust Echo

Urban Rust Echo

See it in context.

Ready when you are.

Built with Urban Rust Echo.

How to use Urban Rust Echo

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Muted Warmth

Earthy Depth

Soft Industrial

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Urban Rust Echo