Back to palettes

Palette

Retro Diner Glaze

Bright, contrasting colors with a retro vibe, inspired by classic 50s diners.

vibrantretro5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#E63946#F4D35E#EE964B#5DA2D5#2F6690

Palette guide

How to use Retro Diner Glaze

Overview

The Retro Diner Glaze palette delivers a punch of vibrant nostalgia, perfectly capturing the energetic spirit of classic 1950s diners. This collection of bold, contrasting colors includes the fiery red of #E63946, the sunny yellow of #F4D35E, and the warm, inviting orange of #EE964B. Complementing these warm tones are two refreshing blues: a bright, playful #5DA2D5 and a deeper, more grounding #2F6690. This palette is a designer's go-to for projects that demand a lively, authentic retro feel, making it ideal for creating eye-catching visuals that evoke a sense of fun and timeless Americana.

Best used for

  • Bold branding for restaurants, cafes, or food trucks
  • Retro-themed website and app user interfaces
  • Packaging design for vintage-inspired products
  • Event posters and promotional materials
  • Digital illustrations with a classic 50s aesthetic
  • Children's product design and playful educational content

Suggested color roles

primary

Use #E63946 (a vibrant red) or #5DA2D5 (a bright blue) as your primary brand color, commanding attention for headlines, main buttons, or key graphical elements.

secondary

Incorporate #F4D35E (a cheerful yellow) to provide a sunny contrast, excellent for secondary information, interactive states, or highlighting important features.

accent

Leverage #EE964B (a rich orange) to add warmth and a playful pop, perfect for calls to action, small details, or decorative motifs that need to stand out.

background

A neutral background like a light cream or white will allow these vibrant colors to truly shine. For a bolder look, #2F6690 (a deep blue) can serve as a sophisticated background for hero sections.

text

On lighter backgrounds, use a strong black or the deep #2F6690 for optimal readability. For text on darker colors like #2F6690, crisp white provides excellent contrast.

Accessibility notes

  • Ensure sufficient contrast when pairing #F4D35E (yellow) with lighter text; dark text is almost always required.
  • Be mindful of color blind users when using red (#E63946) and green if a green were present; however, the blues offer good distinction.
  • Test all text and interactive element contrasts, particularly for smaller font sizes, to meet WCAG guidelines.
  • For backgrounds using #2F6690, ensure white or very light text has a strong enough contrast ratio for legibility.

Recommended combinations

Classic Diner

The quintessential retro combination, perfect for main branding elements, headers, and UI accents in a classic 50s style.

#E63946 · #F4D35E · #5DA2D5

Warm & Inviting

Creates a cozy yet vibrant feel, ideal for backgrounds, illustrations, or sections focused on warmth and hospitality.

#F4D35E · #EE964B · #2F6690

Bold Contrast

Offers high impact and readability, excellent for hero sections, strong call-to-action buttons, or striking visual displays.

#2F6690 · #E63946 · #F4D35E

CSS variables

:root {
  --retro-diner-glaze-2-1: #E63946;
  --retro-diner-glaze-2-2: #F4D35E;
  --retro-diner-glaze-2-3: #EE964B;
  --retro-diner-glaze-2-4: #5DA2D5;
  --retro-diner-glaze-2-5: #2F6690;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-diner-glaze-2": {
        1: "#E63946",
        2: "#F4D35E",
        3: "#EE964B",
        4: "#5DA2D5",
        5: "#2F6690",
      }
    }
  }
}

Related searches

vibrant retro color scheme50s diner paletteclassic Americana colorsbold vintage designmid-century modern brights

Palette colors

Hex values

Color 1#E63946
·
Color 2#F4D35E
·
Color 3#EE964B
·
Color 4#5DA2D5
·
Color 5#2F6690
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.8:1Fail
1.8:1Fail
1.5:1Fail
1.5:1Fail
2
2.8:1Fail
1.6:1Fail
1.9:1Fail
4.2:1AA18
3
1.8:1Fail
1.6:1Fail
1.2:1Fail
2.7:1Fail
4
1.5:1Fail
1.9:1Fail
1.2:1Fail
2.2:1Fail
5
1.5:1Fail
4.2:1AA18
2.7:1Fail
2.2:1Fail

Similar palettes

More like Retro Diner Glaze

View all vibrant
Retro Diner Booth
Retro Diner Chic
Soda Fountain Pop
Diner Booth Jive
Diner Booth Vinyl
Diner Jukebox Pop