Back to palettes

Palette

Rusty Metal Patina

Earthy, coppery tones reflecting the weathered beauty of oxidized metal and forgotten machinery.

warmnatural5 colors
More warm 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

#8B4513#A0522D#B22222#D2691E#7D3F28

Palette guide

How to use Rusty Metal Patina

Overview

The "Rusty Metal Patina" palette (ID: rusty-metal-patina-3) presents a robust collection of earthy, coppery tones that perfectly reflect the weathered beauty of oxidized metal and forgotten machinery. It features a rich spectrum of browns and oranges, from the deep #7D3F28 and #8B4513 to the more vibrant #A0522D and #D2691E, with a strong #B22222 adding a fiery rust element. This palette exudes a natural, aged, and industrial mood. Designers can leverage these hex codes for branding, web design, or editorial content that requires a strong, grounded, and authentic vintage feel. Developers will find it excellent for creating warm, impactful themes that tell a story of durability and time.

Best used for

  • Rustic industrial branding
  • Website design for outdoor gear or workshops
  • Packaging for artisan coffee or craft beer
  • Thematic content for historical preservation
  • Digital art with a warm, earthy feel
  • UI elements for a rugged, vintage application

Suggested color roles

primary

#A0522D (Sienna) - A versatile, warm brown-orange that serves as an excellent main color for content blocks or large UI components, providing a balanced and inviting base.

secondary

#8B4513 (Saddle Brown) - A deeper, more traditional brown, ideal for headers, footers, or background sections that require more visual weight and grounding.

accent

#B22222 (Firebrick) - A powerful, vibrant red, perfect for call-to-action buttons, key headlines, or interactive elements that need to stand out with intensity.

background

#D2691E (Chocolate/Orange-Brown) - A warm, inviting mid-tone that can serve as a primary background, offering a cozy feel while providing good contrast for text.

text

#7D3F28 (Dark Rust Brown) - Offers strong readability on #D2691E or a light cream background, maintaining the palette's deep, earthy character.

Accessibility notes

  • Ensure #7D3F28 text on #D2691E background meets WCAG contrast guidelines; this pairing should be sufficient.
  • The vibrant #B22222 is best for larger text or accents; avoid for small body text on similarly warm backgrounds.
  • For maximum readability on darker backgrounds like #7D3F28, use a light cream or off-white text.
  • Always check contrast ratios, especially when combining the various warm brown and orange tones for text and background.

Recommended combinations

Earthy Base

#D2691E as a warm background, #A0522D for content blocks, and #8B4513 for headers or main text.

#D2691E · #A0522D · #8B4513

Vibrant Rust

#8B4513 for a deep background, #B22222 for striking accents, and #D2691E for secondary text or elements.

#8B4513 · #B22222 · #D2691E

Deep Industrial

#A0522D for main elements, #7D3F28 for strong contrast, and #B22222 for key highlights.

#A0522D · #7D3F28 · #B22222

CSS variables

:root {
  --rusty-metal-patina-3-1: #8B4513;
  --rusty-metal-patina-3-2: #A0522D;
  --rusty-metal-patina-3-3: #B22222;
  --rusty-metal-patina-3-4: #D2691E;
  --rusty-metal-patina-3-5: #7D3F28;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "rusty-metal-patina-3": {
        1: "#8B4513",
        2: "#A0522D",
        3: "#B22222",
        4: "#D2691E",
        5: "#7D3F28",
      }
    }
  }
}

Related searches

earthy orange rust paletteaged industrial colorsweathered copper tonesnatural vintage brownsrobust red brown scheme

Palette colors

Hex values

Color 1#8B4513
·
Color 2#A0522D
·
Color 3#B22222
·
Color 4#D2691E
·
Color 5#7D3F28
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.1:1Fail
2:1Fail
1.1:1Fail
2
1.3:1Fail
1.2:1Fail
1.5:1Fail
1.4:1Fail
3
1.1:1Fail
1.2:1Fail
1.8:1Fail
1.2:1Fail
4
2:1Fail
1.5:1Fail
1.8:1Fail
2.2:1Fail
5
1.1:1Fail
1.4:1Fail
1.2:1Fail
2.2:1Fail

Similar palettes

More like Rusty Metal Patina

View all warm