Palette

Aged Copper Patina

Rich, weathered browns and muted creams evoking the beauty of aged copper and timeworn metals.

earthelegant5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Aged Copper 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 Aged Copper Patina.

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

Data visualization

#4D473B#8B6E59#AE987D#D0B8A1#D8D2CD

Palette guide

How to use Aged Copper Patina

Overview

The Aged Copper Patina palette features rich, weathered browns and muted creams, evoking the beauty of aged copper and timeworn metals. Ranging from the deep #4D473B to the soft #D8D2CD, this collection is perfect for designs seeking an elegant, vintage, or rustic aesthetic. Designers can use these sophisticated neutrals to create a sense of history, warmth, and understated luxury. The mid-tones like #8B6E59 and #AE987D provide depth and texture, making this palette versatile for branding, web interfaces, and print materials that aim for a timeless and refined appeal. It offers a grounded yet sophisticated visual experience.

Best used for

Elegant vintage branding
Rustic chic interior design
High-end craft product packaging
Historical documentary interfaces
Fine stationery and invitations
Artisan coffee shop branding

Suggested color roles

primary

Use #8B6E59 as a dominant warm brown for headers or key content areas, providing a rich, established feel.

secondary

Employ #AE987D for navigation or supporting sections, offering a lighter, softer aged copper tone.

accent

Apply #D0B8A1 as a subtle accent for highlights or delicate graphic details, maintaining the refined aesthetic.

background

Utilize #D8D2CD as a soft, almost off-white background, ensuring excellent readability and a vintage feel.

text

For body text, a dark brown or charcoal (e.g., #4D473B) provides excellent contrast against #D8D2CD. For headlines, #8B6E59 offers a distinguished look on lighter backgrounds.

Accessibility notes

Ensure strong contrast for text in #4D473B or #8B6E59 against #D8D2CD backgrounds for readability.
Avoid using #D0B8A1 or #AE987D for small body text on lighter backgrounds; reserve them for accents or larger type.
Test color pairings for interactive elements to guarantee they meet WCAG contrast requirements.
Consider using a pure black or very dark brown for body copy on very light backgrounds for optimal readability.

Recommended combinations

Warm Patina

Creates a rich, earthy gradient, perfect for backgrounds or sections requiring depth and warmth.

#4D473B · #8B6E59 · #AE987D

Aged Elegance

Highlights a soft, refined transition, ideal for delicate details, overlays, or subtle branding.

#AE987D · #D0B8A1 · #D8D2CD

Grounded Contrast

Provides a clear, readable design with a light background and strong, warm, dark text elements.

#D8D2CD · #4D473B · #8B6E59

CSS variables

:root {
  --aged-copper-patina-1: #4D473B;
  --aged-copper-patina-2: #8B6E59;
  --aged-copper-patina-3: #AE987D;
  --aged-copper-patina-4: #D0B8A1;
  --aged-copper-patina-5: #D8D2CD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "aged-copper-patina": {
        1: "#4D473B",
        2: "#8B6E59",
        3: "#AE987D",
        4: "#D0B8A1",
        5: "#D8D2CD",
      }
    }
  }
}

Hex values

Color 1#4D473B

Color 2#8B6E59

Color 3#AE987D

Color 4#D0B8A1

Color 5#D8D2CD

Accessibility

Contrast checker

2:1Fail

3.3:1AA18

4.8:1AA

6.1:1AA

2:1Fail

1.7:1Fail

2.5:1Fail

3.1:1AA18

3.3:1AA18

1.7:1Fail

1.5:1Fail

1.8:1Fail