Palette

Chrome & Neon Cafe

Bold, contrasting colors evoking the lively, playful atmosphere of a classic 1950s diner and jukebox.

vibrantretro5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Chrome & Neon Cafe 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 & Neon Cafe.

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

Data visualization

#FF005D#00FF99#FFFF00#5D00FF#FFB6C1

Palette guide

How to use Chrome & Neon Cafe

Overview

The Chrome & Neon Cafe palette is a vibrant and audacious collection, evoking the lively, playful atmosphere of a classic 1950s diner with a modern neon twist. It features bold, contrasting colors: #FF005D (Neon Pink), #00FF99 (Bright Green), #FFFF00 (Vivid Yellow), and #5D00FF (Electric Purple). The softer #FFB6C1 (Light Pink) provides a subtle, balancing touch, hinting at classic diner pastels. This palette is perfect for designers aiming to create an energetic, retro-futuristic, or playful aesthetic. It's particularly effective for entertainment, tech, or any design that benefits from a high-impact, eye-catching, and unconventional visual language.

Best used for

Retro arcade game branding
Neon-themed event promotions
Cyberpunk art and design
Youth-focused entertainment platforms
Vibrant social media campaigns
Modern diner or bar branding

Suggested color roles

primary

Utilize #FF005D (Neon Pink) for dominant branding elements, bold headlines, or impactful call-to-actions.

secondary

Apply #00FF99 (Bright Green) for navigation, interactive elements, or to create a strong, electric contrast.

accent

Employ #FFFF00 (Vivid Yellow) for highlights, warnings, or playful decorative elements to enhance the neon glow.

background

A deep black (#000000) is recommended as a background to allow these intense neon-like colors to truly pop and vibrate.

text

White (#FFFFFF) provides the clearest and most accessible text color against the dark background and vibrant accents.

Accessibility notes

Pair white text with all colors in this palette for optimal readability, especially on a dark background.
Ensure sufficient contrast for #FFFF00 (Vivid Yellow) when used for text, particularly against lighter backgrounds if applicable.
Avoid using two highly saturated colors for text and background without careful contrast checking.
Interactive elements must have clear visual cues and sufficient contrast to be accessible.

Recommended combinations

Neon Glow

Ideal for main branding, logos, or any design needing a high-impact, electric, and futuristic look.

#FF005D · #00FF99 · #FFFF00

Retro Pop

Combine for dynamic graphics, animated elements, or to create a vibrant, playful visual effect.

#5D00FF · #FFB6C1 · #FF005D

Bright Contrast

Use for headers, call-to-actions, or to create distinct, attention-grabbing sections with high energy.

#00FF99 · #FFFF00 · #5D00FF

CSS variables

:root {
  --chrome-neon-cafe-1: #FF005D;
  --chrome-neon-cafe-2: #00FF99;
  --chrome-neon-cafe-3: #FFFF00;
  --chrome-neon-cafe-4: #5D00FF;
  --chrome-neon-cafe-5: #FFB6C1;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "chrome-neon-cafe": {
        1: "#FF005D",
        2: "#00FF99",
        3: "#FFFF00",
        4: "#5D00FF",
        5: "#FFB6C1",
      }
    }
  }
}

Hex values

Color 1#FF005D

Color 2#00FF99

Color 3#FFFF00

Color 4#5D00FF

Color 5#FFB6C1

Accessibility

Contrast checker

2.9:1Fail

3.6:1AA18

1.9:1Fail

2.3:1Fail

2.9:1Fail

1.2:1Fail

5.4:1AA

1.2:1Fail

3.6:1AA18

1.2:1Fail

6.7:1AA

1.5:1Fail

1.9:1Fail

5.4:1AA

6.7:1AA

4.4:1AA18

2.3:1Fail

1.2:1Fail

1.5:1Fail

4.4:1AA18

Similar palettes

More like Chrome & Neon Cafe

Chrome & Neon Cafe

See it in context.

Ready when you are.

Built with Chrome & Neon Cafe.

How to use Chrome & Neon Cafe

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Neon Glow

Retro Pop

Bright Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Chrome & Neon Cafe