Palette

Vintage Poster Glam

Draws inspiration from bold, graphic art deco posters, vibrant with clear, elegant lines.

vibrantretro5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Vintage Poster Glam 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 Vintage Poster Glam.

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

Data visualization

#191970#B22222#FFD700#808080#F5F5DC

Palette guide

How to use Vintage Poster Glam

Overview

The Vintage Poster Glam palette is a bold and striking collection that draws inspiration from the Art Deco era, perfect for designers and developers aiming for a sophisticated, vibrant retro look. Featuring a deep Midnight Blue `#191970`, a powerful Firebrick Red `#B22222`, a luminous Gold `#FFD700`, a versatile Gray `#808080`, and a soft Moccasin `#F5F5DC`, this palette offers high contrast and dramatic flair. It's ideal for projects that demand attention, combining classic elegance with a distinct, graphic energy reminiscent of glamorous vintage advertisements and theatrical posters.

Best used for

Art Deco themed event branding
Luxury product and fashion design
Retro-inspired website and app interfaces
Theatrical production posters and programs
High-impact editorial design
Festive and celebratory marketing materials

Suggested color roles

primary

Use `#191970` (Midnight Blue) for strong headings, primary calls-to-action, or sophisticated background elements.

secondary

Apply `#B22222` (Firebrick Red) for impactful accents, alerts, or to draw immediate attention to key features.

accent

Employ `#FFD700` (Gold) for luxurious highlights, decorative motifs, or premium elements to convey prestige.

background

The soft `#F5F5DC` (Moccasin) provides a gentle, warm canvas that allows the bolder colors to truly pop.

text

For maximum legibility, use `#191970` (Midnight Blue) or `#808080` (Gray) against the lighter backgrounds.

Accessibility notes

Ensure excellent contrast between `#FFD700` and any background color, as gold can be challenging for readability.
Pair `#191970` and `#B22222` with `#F5F5DC` for high contrast text, meeting WCAG AA standards easily.
Avoid using `#808080` (Gray) on backgrounds too close in luminosity to prevent text washing out.
Consider larger font sizes or bolding for text using `#FFD700` to enhance visibility, especially on busy backgrounds.

Recommended combinations

Bold Statement

Perfect for creating a dramatic, high-impact header or a striking visual centerpiece.

#191970 · #FFD700 · #B22222

Elegant Contrast

Ideal for clean, sophisticated layouts where readability and structure are paramount.

#F5F5DC · #191970 · #808080

Retro Pop

Use for vibrant graphic elements, playful accents, or calls to action that demand attention.

#B22222 · #FFD700 · #F5F5DC

CSS variables

:root {
  --vintage-poster-glam-1: #191970;
  --vintage-poster-glam-2: #B22222;
  --vintage-poster-glam-3: #FFD700;
  --vintage-poster-glam-4: #808080;
  --vintage-poster-glam-5: #F5F5DC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vintage-poster-glam": {
        1: "#191970",
        2: "#B22222",
        3: "#FFD700",
        4: "#808080",
        5: "#F5F5DC",
      }
    }
  }
}

Hex values

Color 1#191970

Color 2#B22222

Color 3#FFD700

Color 4#808080

Color 5#F5F5DC

Accessibility

Contrast checker

2.2:1Fail

10.6:1AAA

3.8:1AA18

13.4:1AAA