Back to palettes

Palette

Retro Diner Glow

Bright, playful colors from a classic 1950s diner, full of nostalgic charm.

vibrantretro5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#E84A5F#FFD23F#3B8686#FFDD95#D8D8D8

Palette guide

How to use Retro Diner Glow

Overview

The Retro Diner Glow palette offers a charming and playful collection of colors, perfectly capturing the nostalgic essence of a 1950s diner. It features a warm, inviting #E84A5F (coral red), a cheerful #FFD23F (sunny yellow), and a refreshing #3B8686 (teal). The palette is softened by the inclusion of a lighter #FFDD95 (pale yellow) and a versatile #D8D8D8 (light grey), providing excellent options for backgrounds and neutral spaces. This blend of vibrant and muted tones is ideal for designers and developers looking to create projects with a friendly, vintage-inspired aesthetic that feels both authentic and approachable.

Best used for

  • Bakery or coffee shop branding and interior design
  • Vintage-inspired packaging for artisanal products
  • Children's clothing and toy design with a retro touch
  • Cheerful and inviting website interfaces
  • Event branding for nostalgic-themed parties
  • Digital illustrations and social media graphics

Suggested color roles

primary

Use #E84A5F (coral red) for a warm, inviting primary presence in branding, headlines, or key interactive elements, evoking immediate charm and energy.

secondary

Introduce #3B8686 (teal) to offer a cool, sophisticated contrast, perfect for secondary navigation, information panels, or to balance the warmer tones.

accent

Employ #FFD23F (sunny yellow) to add bright, cheerful pops, ideal for calls to action, highlights, or playful decorative elements that need to stand out.

background

The light #D8D8D8 (light grey) provides a clean, neutral canvas, allowing the other colors to shine. Alternatively, #FFDD95 (pale yellow) can offer a softer, warmer background.

text

On lighter backgrounds like #D8D8D8 or #FFDD95, a dark charcoal or deep brown (e.g., #333333 or a dark version of #3B8686) ensures excellent readability. White text works well on #3B8686.

Accessibility notes

  • Carefully check contrast ratios for text on #FFDD95 (pale yellow) and #FFD23F (sunny yellow); dark text is crucial for legibility.
  • Ensure sufficient visual distinction between #FFD23F and #FFDD95 when used in close proximity, especially for conveying different meanings.
  • The #D8D8D8 (light grey) offers a safe and accessible background for most text colors within the palette.
  • For interactive elements, consider using a subtle border or icon in addition to color change to indicate states, enhancing usability.

Recommended combinations

Warm & Playful

Creates an inviting and cheerful feel, perfect for highlighting promotions, playful illustrations, or areas requiring a welcoming touch.

#E84A5F · #FFD23F · #FFDD95

Retro Balance

Offers a sophisticated yet playful balance, ideal for main branding, headers, or sections requiring a clear, structured, and vintage look.

#3B8686 · #E84A5F · #D8D8D8

Sunny Contrast

Provides excellent readability and a bright, fresh aesthetic, suitable for UI elements, informational panels, or clean design layouts.

#D8D8D8 · #FFD23F · #3B8686

CSS variables

:root {
  --retro-diner-glow-3-1: #E84A5F;
  --retro-diner-glow-3-2: #FFD23F;
  --retro-diner-glow-3-3: #3B8686;
  --retro-diner-glow-3-4: #FFDD95;
  --retro-diner-glow-3-5: #D8D8D8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-diner-glow-3": {
        1: "#E84A5F",
        2: "#FFD23F",
        3: "#3B8686",
        4: "#FFDD95",
        5: "#D8D8D8",
      }
    }
  }
}

Related searches

1950s diner color schemecheerful vintage paletteretro coral teal yellownostalgic branding colorsmid-century modern soft palette

Palette colors

Hex values

Color 1#E84A5F
·
Color 2#FFD23F
·
Color 3#3B8686
·
Color 4#FFDD95
·
Color 5#D8D8D8
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.6:1Fail
1.1:1Fail
2.9:1Fail
2.6:1Fail
2
2.6:1Fail
2.9:1Fail
1.1:1Fail
1:1Fail
3
1.1:1Fail
2.9:1Fail
3.2:1AA18
3:1Fail
4
2.9:1Fail
1.1:1Fail
3.2:1AA18
1.1:1Fail
5
2.6:1Fail
1:1Fail
3:1Fail
1.1:1Fail

Similar palettes

More like Retro Diner Glow

View all vibrant