Back to palettes

Palette

Rusty Metal Patina

Weathered reds and deep browns emulate the organic decay and texture of rusted metal surfaces.

neutralnatural5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Rusty Metal 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 Rusty Metal Patina.

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

Data visualization

#5E362F#7B4D45#99645D#B97E75#DCC2BE

Palette guide

How to use Rusty Metal Patina

Overview

The "Rusty Metal Patina" palette (ID: rusty-metal-patina-2) masterfully emulates the organic decay and texture of rusted metal surfaces through a sophisticated gradient of weathered reds and deep browns. This neutral-leaning collection progresses from the rich #5E362F and #7B4D45 to the softer #99645D and #B97E75, culminating in the delicate #DCC2BE. The palette offers a harmonious range that is both earthy and refined. Designers can use this for projects requiring a natural, aged, or subtly industrial aesthetic. Developers will find these hex codes ideal for creating warm, inviting themes, subtle background textures, or elegant interfaces that convey a sense of history and understated beauty.

Best used for

  • Elegant, earthy brand identities
  • UI design for artisanal craft websites
  • Photography backdrops for natural products
  • Interior decor inspiration for rustic minimalism
  • Packaging design for coffee or chocolate brands
  • Editorial layouts with a soft, aged feel

Suggested color roles

primary

#7B4D45 (Medium Brown/Rust) - A balanced, versatile brown that serves as an excellent main color for content blocks or larger UI components, providing warmth and depth.

secondary

#5E362F (Dark Coffee) - A deep, rich brown ideal for headers, footers, or background sections that require more visual weight and grounding.

accent

#99645D (Rosy Brown) - A softer, more inviting rust hue, perfect for subtle accents, interactive elements, or secondary headlines that need a gentle pop.

background

#DCC2BE (Very Light Brown/Pinkish Beige) - A delicate, warm light background that offers excellent readability for darker text and keeps the overall design feeling open and refined.

text

#5E362F (Dark Coffee) - Provides strong contrast and a sophisticated, earthy look when used on #DCC2BE or #B97E75 backgrounds, ensuring readability.

Accessibility notes

  • #5E362F text on #DCC2BE background offers excellent contrast, meeting WCAG AA.
  • #7B4D45 or #99645D can be used for larger text on #DCC2BE, but check contrast for smaller text.
  • Avoid using the lighter colors, #B97E75 or #DCC2BE, for text on similar light backgrounds.
  • Consider using a very dark brown or black for primary text on the lightest backgrounds for universal readability.

Recommended combinations

Soft Patina

#DCC2BE as a gentle background, #B97E75 for subtle elements, and #7B4D45 for main text or headings.

#DCC2BE · #B97E75 · #7B4D45

Deep Earth

#5E362F for a rich background, #7B4D45 for content blocks, and #99645D for softer accents.

#5E362F · #7B4D45 · #99645D

Aged Elegance

#B97E75 as a primary section color, #5E362F for deep contrast elements, and #DCC2BE for delicate text.

#B97E75 · #5E362F · #DCC2BE

CSS variables

:root {
  --rusty-metal-patina-2-1: #5E362F;
  --rusty-metal-patina-2-2: #7B4D45;
  --rusty-metal-patina-2-3: #99645D;
  --rusty-metal-patina-2-4: #B97E75;
  --rusty-metal-patina-2-5: #DCC2BE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "rusty-metal-patina-2": {
        1: "#5E362F",
        2: "#7B4D45",
        3: "#99645D",
        4: "#B97E75",
        5: "#DCC2BE",
      }
    }
  }
}

Related searches

earthy rust brown paletteaged metal neutral colorsnatural patina color schemesoft industrial hueswarm beige brown palette

Palette colors

Hex values

Color 1#5E362F
·
Color 2#7B4D45
·
Color 3#99645D
·
Color 4#B97E75
·
Color 5#DCC2BE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.1:1Fail
3.1:1AA18
6.1:1AA
2
1.5:1Fail
1.5:1Fail
2.1:1Fail
4.2:1AA18
3
2.1:1Fail
1.5:1Fail
1.5:1Fail
2.9:1Fail
4
3.1:1AA18
2.1:1Fail
1.5:1Fail
2:1Fail
5
6.1:1AA
4.2:1AA18
2.9:1Fail
2:1Fail

Similar palettes

More like Rusty Metal Patina

View all neutral
Aged Scroll Patina
Ancient Papyrus Scroll
Ancient Script
Ancient Temple Sandstone
Antique Library Pages
Bohemian Dream Weaver