Back to palettes

Palette

Chrome Diner Jive

A playful mix of pastel teals and pinks, evoking the classic, cheerful atmosphere of a 50s diner.

Retroplayful5 colors
More Retro palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Chrome Diner Jive 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 Chrome Diner Jive.

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

Data visualization

#A2DCE3#E3BAC6#3E5F8A#555555#FFFFFF

Palette guide

How to use Chrome Diner Jive

Overview

The Chrome Diner Jive palette is a playful and nostalgic collection, evoking the cheerful atmosphere of a 1950s diner. It blends soft pastels like #A2DCE3 (Light Teal) and #E3BAC6 (Dusty Pink) with the classic Americana feel of #3E5F8A (Steel Blue). The grounding #555555 (Medium Grey) and crisp #FFFFFF (White) complete the retro vibe, reminiscent of chrome accents and clean countertops. This palette is ideal for designers seeking to convey fun, nostalgia, and a touch of vintage charm. It's particularly effective for food and beverage branding, retro-themed events, or any design that benefits from a lighthearted and inviting aesthetic.

Best used for

  • Retro diner or cafe branding
  • Vintage-themed event invitations
  • Food packaging with a nostalgic twist
  • Children's party decor
  • Lifestyle blogs with a retro aesthetic
  • Fashion inspired by the 50s

Suggested color roles

primary

Utilize #A2DCE3 (Light Teal) for main background areas or large content blocks, setting a cheerful tone.

secondary

Apply #3E5F8A (Steel Blue) for headings, navigation, or to provide a sturdy, classic anchor.

accent

Employ #E3BAC6 (Dusty Pink) for call-to-action buttons, highlights, or decorative elements to add a playful pop.

background

Use #FFFFFF (Pure White) as a clean, bright background that allows the pastel and deeper tones to shine.

text

A dark grey (#555555) or black (#000000) is recommended for body text to ensure optimal readability against light backgrounds.

Accessibility notes

  • Ensure sufficient contrast for text on #FFFFFF background; use #555555 or black for readability.
  • Pair white text with #3E5F8A for optimal readability.
  • Avoid using #A2DCE3 or #E3BAC6 for text on similar light backgrounds due to low contrast.
  • Test contrast ratios for interactive elements, ensuring they are clearly distinguishable for all users.

Recommended combinations

Diner Classic

Ideal for a clean, retro look with #FFFFFF as background, #A2DCE3 for sections, and #3E5F8A for accents.

#FFFFFF · #A2DCE3 · #3E5F8A

Sweet Pastel

Perfect for soft backgrounds, illustrations, or elements needing a gentle, playful feel.

#E3BAC6 · #A2DCE3 · #FFFFFF

Chrome Accents

Combine for metallic-look elements, strong headings, and a soft, contrasting accent.

#555555 · #3E5F8A · #E3BAC6

CSS variables

:root {
  --chrome-diner-jive-1: #A2DCE3;
  --chrome-diner-jive-2: #E3BAC6;
  --chrome-diner-jive-3: #3E5F8A;
  --chrome-diner-jive-4: #555555;
  --chrome-diner-jive-5: #FFFFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "chrome-diner-jive": {
        1: "#A2DCE3",
        2: "#E3BAC6",
        3: "#3E5F8A",
        4: "#555555",
        5: "#FFFFFF",
      }
    }
  }
}

Related searches

retro diner color palette1950s pastel schemevintage teal pink designchrome accent colorsplayful nostalgic theme

Palette colors

Hex values

Color 1#A2DCE3
·
Color 2#E3BAC6
·
Color 3#3E5F8A
·
Color 4#555555
·
Color 5#FFFFFF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
4.3:1AA18
4.9:1AA
1.5:1Fail
2
1.1:1Fail
3.8:1AA18
4.3:1AA18
1.7:1Fail
3
4.3:1AA18
3.8:1AA18
1.1:1Fail
6.5:1AA
4
4.9:1AA
4.3:1AA18
1.1:1Fail
7.5:1AAA
5
1.5:1Fail
1.7:1Fail
6.5:1AA
7.5:1AAA

Similar palettes

More like Chrome Diner Jive

View all Retro