Back to palettes

Palette

Retro Diner Booth

Lively reds, cool teals, and classic cream evoke the playful, nostalgic atmosphere of a 1950s diner.

vibrantretro5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Retro Diner Booth 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 Retro Diner Booth.

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

Data visualization

#B22222#20B2AA#F5F5DC#808080#FFD700

Palette guide

How to use Retro Diner Booth

Overview

The Retro Diner Booth palette offers a lively yet balanced take on vintage aesthetics, blending warm and cool tones for a nostalgic atmosphere. It features a robust Firebrick (#B22222) for bold statements, complemented by a refreshing LightSeaGreen (#20B2AA) that adds a unique, playful twist. The soft, inviting Beige (#F5F5DC) provides a gentle background, while a versatile Gray (#808080) offers a touch of classic chrome or subtle neutrality. A radiant Gold (#FFD700) brings a luxurious, eye-catching accent. This combination is perfect for designs that aim to feel both energetic and refined, ideal for modern retro branding, digital interfaces, or whimsical print materials.

Best used for

  • Modern retro branding
  • Vintage-inspired web design
  • Playful product packaging
  • Themed event promotions
  • Children's apparel design
  • Digital art and illustration

Suggested color roles

primary

Use #B22222 (Firebrick) for impactful headers, main calls to action, or prominent brand elements, drawing immediate attention.

secondary

Apply #20B2AA (LightSeaGreen) for secondary information, interactive states, or unique design accents, providing a cool, fresh contrast.

accent

Leverage #FFD700 (Gold) for premium details, key highlights, or decorative elements that require a luxurious, eye-catching pop.

background

Employ #F5F5DC (Beige) as a soft, warm, and neutral background color, ensuring readability and a comforting vintage feel.

text

Utilize #808080 (Gray) for body text on lighter backgrounds, offering a softer alternative to black while maintaining good legibility, or use a darker charcoal.

Accessibility notes

  • Ensure sufficient contrast when using #808080 text on #F5F5DC; a darker gray or black might be necessary for body copy.
  • #B22222 and #FFD700 provide good contrast against #F5F5DC for headlines and calls to action.
  • Check contrast carefully if using #20B2AA for text on #F5F5DC, as it may not meet WCAG AA standards.
  • Consider using white text on #B22222 or #20B2AA for optimal readability on darker elements.

Recommended combinations

Energetic Retro

Dynamic layouts, contrasting sections, and bold typography for a modern vintage feel.

#B22222 · #20B2AA · #F5F5DC

Golden Touch

Highlighting premium features, decorative elements, and metallic accents for a touch of elegance.

#B22222 · #FFD700 · #808080

Cool & Calm

Subtle backgrounds, informational sections, and secondary design elements that require a relaxed, clean look.

#20B2AA · #F5F5DC · #808080

CSS variables

:root {
  --retro-diner-booth-7-1: #B22222;
  --retro-diner-booth-7-2: #20B2AA;
  --retro-diner-booth-7-3: #F5F5DC;
  --retro-diner-booth-7-4: #808080;
  --retro-diner-booth-7-5: #FFD700;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-diner-booth-7": {
        1: "#B22222",
        2: "#20B2AA",
        3: "#F5F5DC",
        4: "#808080",
        5: "#FFD700",
      }
    }
  }
}

Related searches

retro red teal gold palettevintage diner color combination1950s aesthetic colorsenergetic retro palettebeige gray red gold design

Palette colors

Hex values

Color 1#B22222
·
Color 2#20B2AA
·
Color 3#F5F5DC
·
Color 4#808080
·
Color 5#FFD700
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
6:1AA
1.7:1Fail
4.8:1AA
2
2.5:1Fail
2.4:1Fail
1.5:1Fail
1.9:1Fail
3
6:1AA
2.4:1Fail
3.6:1AA18
1.3:1Fail
4
1.7:1Fail
1.5:1Fail
3.6:1AA18
2.8:1Fail
5
4.8:1AA
1.9:1Fail
1.3:1Fail
2.8:1Fail

Similar palettes

More like Retro Diner Booth

View all vibrant
Retro Diner Booth
Retro Diner Chic
Retro Diner Glow
Retro Diner Glow
Atomic Age Diner
Diner Booth Jive