Palette

Mid-Century Malt Shop

A vibrant, playful blend of primary colors and pastels, evoking the classic charm of a 1950s malt shop.

retroretro5 colors

More retro palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mid-Century Malt Shop 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 Mid-Century Malt Shop.

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

Data visualization

#DC143C#FFD700#ADD8E6#F0F8FF#800080

Palette guide

How to use Mid-Century Malt Shop

Overview

The Mid-Century Malt Shop palette is a vibrant, playful blend of primary colors and pastels, evoking the classic charm and lively atmosphere of a 1950s diner. With bold hues like the iconic #DC143C (red) and cheerful #FFD700 (yellow), balanced by the soft #ADD8E6 (light blue) and #F0F8FF (cream), this palette is perfect for designers and developers aiming for a fun, nostalgic aesthetic. It's ideal for creating engaging websites, lively branding, and products that capture the joyful spirit of a bygone era, ensuring a delightful and memorable user experience.

Best used for

Retro diner and cafe branding
Playful children's product design and marketing
Vintage-themed event promotions and invitations
Nostalgic e-commerce sites for collectibles
Casual apparel and accessory lines
Food packaging with a classic American feel

Suggested color roles

primary

#DC143C - A bold, classic red, perfect for main branding, calls to action, or prominent headings to grab attention.

secondary

#FFD700 - A cheerful, bright yellow, ideal for accents, highlights, or secondary graphic elements that convey fun.

accent

#800080 - A deep, unexpected purple, offering a sophisticated pop of contrast for unique details or modern twists.

background

#F0F8FF - A soft, almost-white cream, providing a clean, bright, and airy backdrop that makes other colors pop.

text

Black or a very dark blue for primary text to ensure maximum readability on the light background. #DC143C can be used for large headings.

Accessibility notes

Ensure dark text (black or very dark blue) on #F0F8FF provides sufficient contrast for readability.
#DC143C and #800080 have good contrast on #F0F8FF and are suitable for headings and accents.
Avoid using #FFD700 for small body text on light backgrounds due to potential low contrast.
Test interactive elements to ensure they are clearly distinguishable and accessible for all users.

Recommended combinations

Diner Classic

The quintessential red, yellow, and cream combination for an authentic 1950s diner look.

#DC143C · #FFD700 · #F0F8FF

Soda Pop

A refreshing blend of light blue and red, reminiscent of cool drinks and classic signage.

#ADD8E6 · #DC143C · #F0F8FF

Retro Twist

A playful and unexpected combination of purple, yellow, and light blue for modern retro appeal.

#800080 · #FFD700 · #ADD8E6

CSS variables

:root {
  --mid-century-malt-shop-1: #DC143C;
  --mid-century-malt-shop-2: #FFD700;
  --mid-century-malt-shop-3: #ADD8E6;
  --mid-century-malt-shop-4: #F0F8FF;
  --mid-century-malt-shop-5: #800080;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mid-century-malt-shop": {
        1: "#DC143C",
        2: "#FFD700",
        3: "#ADD8E6",
        4: "#F0F8FF",
        5: "#800080",
      }
    }
  }
}

Hex values

Color 1#DC143C

Color 2#FFD700

Color 3#ADD8E6

Color 4#F0F8FF

Color 5#800080

Accessibility

Contrast checker

3.6:1AA18

3.3:1AA18

4.7:1AA

1.9:1Fail

3.6:1AA18

1.1:1Fail

1.3:1Fail

6.7:1AA

3.3:1AA18

1.1:1Fail

1.4:1Fail

6.2:1AA

4.7:1AA

1.3:1Fail

1.4:1Fail

8.8:1AAA

1.9:1Fail

6.7:1AA

6.2:1AA

8.8:1AAA

Similar palettes

More like Mid-Century Malt Shop