Palette

Art Deco Charm

A sophisticated mix of stark blacks, silvers, and metallic golds, echoing the luxurious geometry of Art Deco design.

vibrantelegant5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Art Deco Charm 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 Art Deco Charm.

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

Data visualization

#0A0A0A#C8C8C8#D4AF37#FFFFFF#36454F

Palette guide

How to use Art Deco Charm

Overview

The Art Deco Charm palette presents a sophisticated mix of stark blacks, silvers, and metallic golds, echoing the luxurious geometry of Art Deco design. With prominent colors like the deep near-black #0A0A0A, the opulent gold #D4AF37, and the crisp white #FFFFFF, this collection is designed for high-contrast, glamorous projects. Developers can build striking interfaces with clear visual hierarchy, utilizing these sharp distinctions. Designers will find this palette perfect for creating high-end fashion branding, exclusive event invitations, or bold architectural visuals, delivering an unmistakable sense of vintage luxury and modern elegance.

Best used for

High-end fashion branding
Luxury product packaging
Art gallery websites
Exclusive event invitations
Sophisticated UI/UX design
Vintage film poster aesthetics

Suggested color roles

primary

Designate #0A0A0A as the dominant color for bold statements, main text, or dramatic backgrounds, providing a strong, elegant anchor.

secondary

Utilize #D4AF37 for opulent accents, headers, or key interactive elements, infusing a sense of luxury and glamour.

accent

Incorporate #C8C8C8 for subtle metallic sheen, dividers, or secondary graphical elements, adding a touch of silver sophistication.

background

Apply #FFFFFF as the primary background color to create a crisp, clean, and high-contrast canvas that allows other colors to pop.

text

For optimal readability, use #0A0A0A on #FFFFFF. For text on darker backgrounds like #36454F, #FFFFFF provides excellent contrast.

Accessibility notes

The contrast between #0A0A0A and #FFFFFF is excellent, ensuring high readability for all text sizes.
When using #D4AF37 for text, ensure it's on a sufficiently dark background (e.g., #0A0A0A or #36454F) to meet WCAG contrast standards.
Avoid using #C8C8C8 for small text on #FFFFFF, as the contrast might be insufficient for some users.
Employ #36454F as an alternative dark background or for secondary dark elements, ensuring white text remains highly legible.

Recommended combinations

Classic Glam

The ultimate high-contrast combination: white background, black text, and a strong gold accent for timeless elegance.

#FFFFFF · #0A0A0A · #D4AF37

Midnight Gold

A deep charcoal background paired with opulent gold accents and crisp white text for a luxurious, dramatic effect.

#36454F · #D4AF37 · #FFFFFF

Silvered Edge

Black as a dominant color, silver for subtle metallic details, and gold for striking highlights, perfect for geometric designs.

#0A0A0A · #C8C8C8 · #D4AF37

CSS variables

:root {
  --art-deco-charm-1: #0A0A0A;
  --art-deco-charm-2: #C8C8C8;
  --art-deco-charm-3: #D4AF37;
  --art-deco-charm-4: #FFFFFF;
  --art-deco-charm-5: #36454F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "art-deco-charm": {
        1: "#0A0A0A",
        2: "#C8C8C8",
        3: "#D4AF37",
        4: "#FFFFFF",
        5: "#36454F",
      }
    }
  }
}

Hex values

Color 1#0A0A0A

Color 2#C8C8C8

Color 3#D4AF37

Color 4#FFFFFF

Color 5#36454F

Accessibility

Contrast checker

11.8:1AAA

9.4:1AAA

19.8:1AAA

2:1Fail

11.8:1AAA

1.3:1Fail

1.7:1Fail

5.9:1AA

9.4:1AAA

1.3:1Fail

2.1:1Fail

4.7:1AA

19.8:1AAA

1.7:1Fail

2.1:1Fail

9.9:1AAA

2:1Fail

5.9:1AA

4.7:1AA

9.9:1AAA

Similar palettes

More like Art Deco Charm

Roaring Twenties Chic