Palette

Gatsby Era Glamour

Embodies the luxurious and opulent spirit of the Art Deco era, with gleaming metallics and deep, rich tones.

elegantelegant5 colors

More elegant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gatsby Era Glamour 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 Gatsby Era Glamour.

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

Data visualization

#B8860B#FFD700#2F4F4F#708090#D2B48C

Palette guide

How to use Gatsby Era Glamour

Overview

The Gatsby Era Glamour palette embodies the luxurious and opulent spirit of the Art Deco era, with gleaming metallics and deep, rich tones. This sophisticated collection features a vibrant goldenrod, #B8860B, a brilliant pure gold, #FFD700, a deep teal-grey, #2F4F4F, a cool steel grey, #708090, and a warm, inviting tan, #D2B48C. These colors work together to create a mood of lavish elegance, high society, and timeless sophistication, making the Gatsby Era Glamour palette ideal for designs that aim to convey wealth, prestige, or a classic, vintage aesthetic. Designers can leverage its strong contrasts for high-impact and memorable visuals.

Best used for

Luxury brand identity and packaging
Art Deco themed event invitations
High-end fashion and jewelry advertising
Vintage cocktail bar or restaurant branding
Elegant website headers and UI elements
Book covers for historical fiction

Suggested color roles

primary

Utilize #2F4F4F as a dominant background to establish a deep, sophisticated, and grounding foundation for the metallic accents.

secondary

Employ #708090 for secondary sections or large text blocks, offering a versatile cool neutral that balances the warmth of gold.

accent

Introduce #FFD700 or #B8860B generously for dazzling highlights, metallic accents, or important calls-to-action.

background

#D2B48C provides a warm, inviting background, perfect for showcasing darker elements or as a complementary neutral.

text

For text against #2F4F4F or #708090, use #FFD700 or white for strong contrast. Against #D2B48C, use #2F4F4F or black for body text.

Accessibility notes

Pairing white or #FFD700 with #2F4F4F offers excellent WCAG AA contrast for text, ensuring strong readability.
The bright gold #FFD700 may not have sufficient contrast with #D2B48C for small text; use it for larger headings or decorative elements.
Ensure interactive elements using gold accents have a clear hover state or sufficient border contrast against their background.
When using #B8860B for text, ensure the background is either very dark (like #2F4F4F) or very light (like white) for readability.

Recommended combinations

Golden Deco

Creates a striking, opulent contrast for luxury branding or elegant website hero sections.

#2F4F4F · #FFD700 · #D2B48C

Glamourous Grey

Excellent for conveying vintage charm and sophistication in editorial layouts or UI accents.

#708090 · #B8860B · #2F4F4F

Roaring Night

Suitable for creating deep, luxurious backgrounds with metallic glints for high-impact visuals and event branding.

#2F4F4F · #708090 · #FFD700

CSS variables

:root {
  --gatsby-era-glamour-1: #B8860B;
  --gatsby-era-glamour-2: #FFD700;
  --gatsby-era-glamour-3: #2F4F4F;
  --gatsby-era-glamour-4: #708090;
  --gatsby-era-glamour-5: #D2B48C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gatsby-era-glamour": {
        1: "#B8860B",
        2: "#FFD700",
        3: "#2F4F4F",
        4: "#708090",
        5: "#D2B48C",
      }
    }
  }
}

Hex values

Color 1#B8860B

Color 2#FFD700

Color 3#2F4F4F

Color 4#708090

Color 5#D2B48C

Accessibility

Contrast checker

2.3:1Fail

2.7:1Fail

1.2:1Fail

1.7:1Fail

2.3:1Fail

6.4:1AA

2.9:1Fail

1.4:1Fail

2.7:1Fail

6.4:1AA

2.2:1Fail

4.5:1AA

1.2:1Fail

2.9:1Fail

2.2:1Fail

2.1:1Fail

1.7:1Fail

1.4:1Fail

4.5:1AA

2.1:1Fail

Similar palettes

More like Gatsby Era Glamour