Back to palettes

Palette

Urban Rust Patina

Capturing the aged beauty of weathered metals and forgotten city corners with a subtle, earthy appeal.

neutraldark5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#A0807A#8C6A64#755650#5E443F#4C3734

Palette guide

How to use Urban Rust Patina

Overview

The Urban Rust Patina palette captures the aged beauty of weathered metals and forgotten city corners with a subtle, earthy appeal. This monochromatic-like scheme ranges from the deep, grounding #4C3734 to the lighter, warm taupe #A0807A, including rich intermediate browns like #5E443F, #755650, and #8C6A64. It’s a sophisticated and moody collection, perfect for designers and developers aiming to create a sense of understated luxury, historical depth, or a dark, introspective atmosphere. The limited contrast encourages textural exploration and thoughtful use of light.

Best used for

  • Dark mode UI with a sophisticated feel
  • Minimalist or luxury branding
  • Historical photography curation
  • Mood-setting art installations
  • Premium menswear or lifestyle brands
  • Abstract digital art and illustration

Suggested color roles

primary

Utilize #4C3734 as the dominant, deep brown for backgrounds, large sections, or robust headers.

secondary

Employ #5E443F or #755650 for secondary content areas, subtle gradients, or to add textural depth.

accent

Introduce #A0807A for soft highlights, delicate borders, or to provide a gentle contrast against darker tones.

background

The darkest #4C3734 creates a deep, immersive background, ideal for moody designs.

text

For optimal readability, use light text such as white or #A0807A against all darker shades in this palette.

Accessibility notes

  • Critical to use very light text (e.g., white or #A0807A) on all colors in this palette to ensure readability due to low contrast.
  • Avoid using any of the darker browns (#4C3734 to #755650) for text on similar dark backgrounds; contrast will be insufficient.
  • For interactive elements, ensure they are clearly distinguishable, perhaps using #A0807A with a strong hover effect or icon.
  • Consider larger font sizes or bolding for all text to enhance readability within this dark, low-contrast palette.

Recommended combinations

Deep & Subtle

Creates a profound, moody base with a soft, light highlight and a deep mid-tone for sophisticated depth.

#4C3734 · #A0807A · #5E443F

Layered Browns

Showcases a harmonious blend of mid-range browns, perfect for textural elements or subtle layering.

#755650 · #8C6A64 · #4C3734

Warm Patina

Blends a warm brown with a light taupe, evoking the soft, aged look of weathered materials.

#5E443F · #A0807A · #755650

CSS variables

:root {
  --urban-rust-patina-4-1: #A0807A;
  --urban-rust-patina-4-2: #8C6A64;
  --urban-rust-patina-4-3: #755650;
  --urban-rust-patina-4-4: #5E443F;
  --urban-rust-patina-4-5: #4C3734;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-rust-patina-4": {
        1: "#A0807A",
        2: "#8C6A64",
        3: "#755650",
        4: "#5E443F",
        5: "#4C3734",
      }
    }
  }
}

Related searches

dark earthy paletteweathered brown tonessophisticated industrialmoody urban colorsminimalist brown

Palette colors

Hex values

Color 1#A0807A
·
Color 2#8C6A64
·
Color 3#755650
·
Color 4#5E443F
·
Color 5#4C3734
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.8:1Fail
2.5:1Fail
3.1:1AA18
2
1.3:1Fail
1.4:1Fail
1.8:1Fail
2.3:1Fail
3
1.8:1Fail
1.4:1Fail
1.3:1Fail
1.7:1Fail
4
2.5:1Fail
1.8:1Fail
1.3:1Fail
1.2:1Fail
5
3.1:1AA18
2.3:1Fail
1.7:1Fail
1.2:1Fail

Similar palettes

More like Urban Rust Patina

View all neutral