Back to palettes

Palette

Jukebox Junction

Bold primaries and contrasting blues reminiscent of a classic 1950s American diner.

vibrantretro5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#B0E0E6#DC143C#FFD700#1E90FF#2F4F4F

Palette guide

How to use Jukebox Junction

Overview

The Jukebox Junction palette is a playful nod to the 1950s, combining bold primaries with contrasting blues for a vibrant retro feel. This energetic collection includes a soft powder blue (#B0E0E6), a striking crimson red (#DC143C), a bright gold (#FFD700), a lively royal blue (#1E90FF), and a deep slate gray (#2F4F4F). It’s ideal for designers and developers seeking to create projects with a sense of fun, nostalgia, and dynamic visual appeal. These colors effectively evoke the lively atmosphere of a classic American diner, perfect for themed branding or engaging digital interfaces.

Best used for

  • Retro-themed branding and marketing
  • Children's entertainment products
  • Casual dining restaurant websites
  • Event posters and promotional materials
  • Arcade or game interface design
  • Playful digital illustrations

Suggested color roles

primary

Utilize #DC143C (crimson red) as a bold, attention-grabbing primary color for brand identity or calls-to-action.

secondary

Employ #1E90FF (royal blue) for strong secondary elements, navigation, or to create vibrant contrasts.

accent

Apply #FFD700 (bright gold) sparingly for energetic highlights, interactive elements, or decorative details.

background

Use #B0E0E6 (powder blue) as a soft, vintage-inspired background that allows the bold colors to pop.

text

For optimal readability, use #2F4F4F (dark slate gray) for all primary body text and headlines on lighter backgrounds.

Accessibility notes

  • The dark colors (#DC143C, #1E90FF, #2F4F4F) provide excellent contrast against the light #B0E0E6 background.
  • Ensure #FFD700 used for text has a dark enough background or is paired with very dark text to meet contrast standards.
  • Always use #2F4F4F for body text on light backgrounds to ensure high readability.
  • Verify contrast ratios for all interactive elements to ensure WCAG compliance.

Recommended combinations

Retro Pop

Ideal for main branding, call-to-actions, and playful illustrations that demand attention.

#DC143C · #1E90FF · #FFD700

Soft Base

Excellent for backgrounds, body text, and subtle accents in content areas.

#B0E0E6 · #2F4F4F · #DC143C

Jukebox Glow

Effective for highlights, interactive elements, or metallic effects in graphic design.

#FFD700 · #1E90FF · #2F4F4F

CSS variables

:root {
  --jukebox-junction-1: #B0E0E6;
  --jukebox-junction-2: #DC143C;
  --jukebox-junction-3: #FFD700;
  --jukebox-junction-4: #1E90FF;
  --jukebox-junction-5: #2F4F4F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jukebox-junction": {
        1: "#B0E0E6",
        2: "#DC143C",
        3: "#FFD700",
        4: "#1E90FF",
        5: "#2F4F4F",
      }
    }
  }
}

Related searches

50s diner paletteretro primary colorsvintage blue red yellowplayful mid-century designclassic arcade colors

Palette colors

Hex values

Color 1#B0E0E6
·
Color 2#DC143C
·
Color 3#FFD700
·
Color 4#1E90FF
·
Color 5#2F4F4F
·

Accessibility

Contrast checker

1
2
3
4
5
1
3.5:1AA18
1:1Fail
2.3:1Fail
6.2:1AA
2
3.5:1AA18
3.6:1AA18
1.5:1Fail
1.8:1Fail
3
1:1Fail
3.6:1AA18
2.3:1Fail
6.4:1AA
4
2.3:1Fail
1.5:1Fail
2.3:1Fail
2.8:1Fail
5
6.2:1AA
1.8:1Fail
6.4:1AA
2.8:1Fail

Similar palettes

More like Jukebox Junction

View all vibrant
Retro Diner Jukebox
Vintage Carnival Ride
Atomic Soda Pop
Jukebox Soda Pop
Neon Arcade Buzz
Nostalgic Soda Pop