Palette

Gilded Age Salon

A decadent collection of rich golds, deep reds, and blues, reflecting the opulence and grandeur of a historical era.

warmelegant5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gilded Age Salon 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 Gilded Age Salon.

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

Data visualization

#D4AF37#8A2B2B#2E4057#EAEAEA#C9AE5D

Palette guide

How to use Gilded Age Salon

Overview

The 'Gilded Age Salon' palette is a decadent collection of rich golds, deep reds, and sophisticated blues, perfectly reflecting the opulence and grandeur of a historical era's elite gathering spaces. Featuring the vibrant #D4AF37 (Gold) and #C9AE5D (Old Gold), it is dramatically contrasted by the profound #8A2B2B (Dark Red) and elegant #2E4057 (Dark Blue). The soft #EAEAEA (Light Gray) provides a clean, refined base. This palette is ideal for designs that aim to convey a sense of historical luxury, intellectual sophistication, and dramatic elegance, evoking the atmosphere of a grand, exclusive salon.

Best used for

Themed restaurant or bar branding
Historical society websites or publications
Luxury hospitality marketing materials
Theatrical production design
Classic literature-inspired graphic design
Upscale event branding and decor

Suggested color roles

primary

Utilize #D4AF37 (Gold) for prominent accents, logos, or striking headlines to convey luxury and importance.

secondary

Apply #2E4057 (Dark Blue) for sophisticated backgrounds, primary text, or to establish a sense of depth and intellect.

accent

Introduce #8A2B2B (Dark Red) sparingly for dramatic calls to action, highlights, or to add a touch of passionate elegance.

background

Employ #EAEAEA (Light Gray) as a clean, elegant backdrop, allowing the richer colors to truly stand out.

text

For optimal readability on lighter backgrounds like #EAEAEA, use #2E4057 (Dark Blue) or #8A2B2B (Dark Red) as your primary text colors.

Accessibility notes

Ensure sufficient contrast when pairing #D4AF37 with #C9AE5D if used for text and background respectively.
Text in #2E4057 or #8A2B2B on an #EAEAEA background provides excellent readability.
Avoid placing #C9AE5D (Old Gold) text directly on #D4AF37 (Gold) for critical information due to low contrast.
The deep #2E4057 (Dark Blue) serves as a strong, accessible color for body text across most lighter elements.

Recommended combinations

Regal Contrast

Creates a sophisticated and balanced look; ideal for main content areas, corporate branding, or elegant layouts.

#EAEAEA · #2E4057 · #D4AF37

Dramatic Flair

Adds a bold and opulent touch; perfect for accentuating important information, headers, or decorative motifs.

#8A2B2B · #D4AF37 · #2E4057

Salon Harmony

Provides a softer, harmonious blend of golds; suitable for subtle backgrounds, secondary elements, or elegant patterns.

#C9AE5D · #EAEAEA · #D4AF37

CSS variables

:root {
  --gilded-age-salon-1: #D4AF37;
  --gilded-age-salon-2: #8A2B2B;
  --gilded-age-salon-3: #2E4057;
  --gilded-age-salon-4: #EAEAEA;
  --gilded-age-salon-5: #C9AE5D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gilded-age-salon": {
        1: "#D4AF37",
        2: "#8A2B2B",
        3: "#2E4057",
        4: "#EAEAEA",
        5: "#C9AE5D",
      }
    }
  }
}

Hex values

Color 1#D4AF37

Color 2#8A2B2B

Color 3#2E4057

Color 4#EAEAEA

Color 5#C9AE5D

Accessibility

Contrast checker

4.1:1AA18

5:1AA

1.7:1Fail

1:1Fail

4.1:1AA18

1.2:1Fail

7.1:1AAA

3.9:1AA18

5:1AA

1.2:1Fail

8.8:1AAA

4.9:1AA