Palette

Rusty Metal Patina

Rich, weathered oranges and browns capturing the beautiful decay of aged metal surfaces.

earthnatural5 colors

More earth 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

#6E452D#975E3B#BF7A49#E0975B#F7B473

Palette guide

How to use Rusty Metal Patina

Overview

The "Rusty Metal Patina" palette (ID: rusty-metal-patina) captures the beautiful decay of aged metal surfaces through a rich gradient of weathered oranges and browns. This earthy collection progresses from the deep #6E452D and #975E3B to the vibrant #BF7A49 and #E0975B, finishing with the soft, almost luminous #F7B473. The palette offers a natural, textured feel, perfect for conveying warmth and history. Designers can leverage these hex codes for branding, web design, or editorial content that requires an organic, vintage, or subtly industrial aesthetic. Developers will find it excellent for creating warm, inviting themes, subtle background textures, or elegant interfaces that evoke a sense of time and craftsmanship.

Best used for

Organic food or beverage branding
Website design for antique dealers or restorers
Interior design inspiration for rustic spaces
Packaging for natural, handmade products
Digital art with an earthy, textured feel
UI elements for a vintage-themed application

Suggested color roles

primary

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

secondary

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

accent

#BF7A49 (Rust Orange) - A vibrant, earthy orange, perfect for call-to-action buttons, key headlines, or interactive elements that need to stand out with warmth.

background

#F7B473 (Pale Orange/Peach) - A delicate, warm light background that offers excellent readability for darker text and keeps the overall design feeling open and inviting.

text

#6E452D (Dark Brown) - Provides strong contrast and a sophisticated, earthy look when used on #F7B473 or #E0975B backgrounds, ensuring readability.

Accessibility notes

#6E452D text on #F7B473 background offers excellent contrast, meeting WCAG AA.
#975E3B or #BF7A49 can be used for larger text on #F7B473, but check contrast for smaller text.
Avoid using the lighter colors, #E0975B or #F7B473, 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

Warm Glow

#F7B473 as a luminous background, #E0975B for content blocks, and #BF7A49 for headers or main text.

#F7B473 · #E0975B · #BF7A49

Deep Earthy

#6E452D for a rich background, #975E3B for content blocks, and #BF7A49 for vibrant accents.

#6E452D · #975E3B · #BF7A49

Aged Texture

#E0975B as a primary section color, #6E452D for deep contrast elements, and #F7B473 for delicate text.

#E0975B · #6E452D · #F7B473

CSS variables

:root {
  --rusty-metal-patina-1: #6E452D;
  --rusty-metal-patina-2: #975E3B;
  --rusty-metal-patina-3: #BF7A49;
  --rusty-metal-patina-4: #E0975B;
  --rusty-metal-patina-5: #F7B473;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "rusty-metal-patina": {
        1: "#6E452D",
        2: "#975E3B",
        3: "#BF7A49",
        4: "#E0975B",
        5: "#F7B473",
      }
    }
  }
}

Hex values

Color 1#6E452D

Color 2#975E3B

Color 3#BF7A49

Color 4#E0975B

Color 5#F7B473

Accessibility

Contrast checker

1.6:1Fail

2.4:1Fail

3.4:1AA18

4.6:1AA

1.6:1Fail

1.5:1Fail

2.2:1Fail

2.9:1Fail

2.4:1Fail

1.5:1Fail

1.4:1Fail

1.9:1Fail

3.4:1AA18

2.2:1Fail

1.4:1Fail

1.3:1Fail

4.6:1AA

2.9:1Fail

1.9:1Fail

1.3:1Fail

Similar palettes

More like Rusty Metal Patina