Back to palettes

Palette

Retro Diner Jukebox

Bold primary colors and crisp white reminiscent of a classic 1950s American diner and its glowing jukebox.

VibrantRetro5 colors
More Vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#00008B#FF0000#FFFFFF#FFFF00#00FF00

Palette guide

How to use Retro Diner Jukebox

Overview

The "Retro Diner Jukebox" palette is a vibrant collection that embodies the lively spirit of classic 1950s diners. Featuring a deep navy blue (#00008B), a bold red (#FF0000), a crisp white (#FFFFFF), a bright yellow (#FFFF00), and an electric green (#00FF00), this scheme is reminiscent of glowing neon signs and cheerful interiors. Designers and developers can leverage these iconic hues to create projects that are energetic, nostalgic, and visually striking, perfect for capturing the playful and optimistic mood of mid-century Americana.

Best used for

  • Themed event marketing and decor
  • Retro arcade game interfaces
  • Children's book illustrations
  • Brand identity for playful products
  • Website design with a vintage pop
  • Signage and point-of-sale materials

Suggested color roles

primary

Use #FF0000 (Red) for dominant elements, calls-to-action, or areas requiring high energy and immediate attention.

secondary

Apply #00008B (Navy Blue) for grounding elements, navigation, or providing a deep, stable contrast to the brighter hues.

accent

Incorporate #FFFF00 (Yellow) and #00FF00 (Green) for dynamic highlights, interactive states, or to emulate neon glow effects.

background

Utilize #FFFFFF (White) as a clean, expansive background to make the vibrant primary and accent colors truly pop and ensure readability.

text

Employ #00008B (Navy Blue) or #FF0000 (Red) for headings and body text on white backgrounds to ensure strong contrast and legibility.

Accessibility notes

  • Ensure #FFFF00 (Yellow) and #00FF00 (Green) text has sufficient contrast, especially when used on #FFFFFF (White) backgrounds. Consider using these as accents, not primary text.
  • Pair #FF0000 (Red) and #00008B (Navy Blue) with #FFFFFF (White) for optimal text and background contrast.
  • Avoid placing #FFFF00 (Yellow) or #00FF00 (Green) directly against each other as text/background without contrast checking.
  • For maximum readability, use #00008B (Navy Blue) or black for body text on light backgrounds.

Recommended combinations

Classic Jukebox

Ideal for creating iconic, high-contrast branding, headers, and hero sections with a timeless appeal.

#FF0000 · #00008B · #FFFFFF

Neon Lights

Excellent for vibrant accents, interactive elements, or designs that aim to evoke the glowing energy of a diner sign.

#FFFF00 · #00FF00 · #FF0000

Bright & Clean

Perfect for clean UI elements, subtle backgrounds, and areas where clarity and a touch of retro charm are needed.

#FFFFFF · #00008B · #FFFF00

CSS variables

:root {
  --retro-diner-jukebox-8-1: #00008B;
  --retro-diner-jukebox-8-2: #FF0000;
  --retro-diner-jukebox-8-3: #FFFFFF;
  --retro-diner-jukebox-8-4: #FFFF00;
  --retro-diner-jukebox-8-5: #00FF00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-diner-jukebox-8": {
        1: "#00008B",
        2: "#FF0000",
        3: "#FFFFFF",
        4: "#FFFF00",
        5: "#00FF00",
      }
    }
  }
}

Related searches

diner primary colorsretro bright palette50s red white blue yellowvibrant jukebox aestheticclassic diner neon scheme

Palette colors

Hex values

Color 1#00008B
·
Color 2#FF0000
·
Color 3#FFFFFF
·
Color 4#FFFF00
·
Color 5#00FF00
·

Accessibility

Contrast checker

1
2
3
4
5
1
3.8:1AA18
15.3:1AAA
14.2:1AAA
11.1:1AAA
2
3.8:1AA18
4:1AA18
3.7:1AA18
2.9:1Fail
3
15.3:1AAA
4:1AA18
1.1:1Fail
1.4:1Fail
4
14.2:1AAA
3.7:1AA18
1.1:1Fail
1.3:1Fail
5
11.1:1AAA
2.9:1Fail
1.4:1Fail
1.3:1Fail

Similar palettes

More like Retro Diner Jukebox

View all Vibrant
Retro Diner Jukebox
Retro Diner Jukebox
Retro Space Race
Retro Jukebox Pop
Retro Neon Dream
Retro Pixel Glitch