Back to palettes

Palette

Retro Diner Neon

Classic bold primaries and glowing oranges, evoking the cheerful, electric vibe of a vintage diner.

vibrantretro5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF0000#00FF00#FFFF00#0000FF#FF8C00

Palette guide

How to use Retro Diner Neon

Overview

The "Retro Diner Neon" palette is a vibrant explosion of primary and secondary colors, perfectly capturing the electric, playful energy of a vintage diner's glowing signs. This bold scheme features an intense red (#FF0000), an electric green (#00FF00), a bright yellow (#FFFF00), a strong blue (#0000FF), and a lively orange (#FF8C00). It's an ideal choice for designers and developers aiming to create projects that are energetic, eye-catching, and full of nostalgic pop-art flair. Leverage these hues to evoke excitement and a sense of timeless fun.

Best used for

  • Arcade game interfaces and branding
  • Bold graphic design and illustrations
  • Party invitations and event signage
  • Children's entertainment products
  • Pop art inspired digital media
  • Themed website hero sections

Suggested color roles

primary

Designate #FF0000 (Red) for high-impact calls-to-action, prominent headlines, or dynamic brand elements that demand attention.

secondary

Utilize #0000FF (Blue) for stable, contrasting sections, navigation, or to ground the more energetic hues.

accent

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

background

Consider a dark neutral like black or charcoal for backgrounds to maximize the neon effect, or use #FFFF00 (Yellow) for a bright, energetic base.

text

For readability, use #0000FF (Blue) or #FF0000 (Red) on light backgrounds, and crisp white or a bright accent like #FFFF00 on dark backgrounds.

Accessibility notes

  • This palette consists of very bright colors; ensure sufficient contrast for text, especially when using light colors on light backgrounds (e.g., #FFFF00 on #00FF00).
  • For true neon effects, pair bright colors with a dark background (e.g., black) to enhance visibility and contrast.
  • Avoid using similar bright hues for text and background in critical areas, as this can cause eye strain.
  • Black or very dark text on #FFFF00 (Yellow) or #FF8C00 (Orange) is recommended for optimal legibility.

Recommended combinations

Primary Pop

Excellent for creating classic, high-energy branding, bold headlines, and impactful visual statements.

#FF0000 · #0000FF · #FFFF00

Neon Glow

Ideal for interactive elements, highlights, or design details that aim to mimic the vibrant glow of retro signage.

#00FF00 · #FF8C00 · #FF0000

Electric Mix

Perfect for playful graphics, secondary accents, or sections requiring a cheerful and dynamic color blend.

#FFFF00 · #0000FF · #FF8C00

CSS variables

:root {
  --retro-diner-neon-2-1: #FF0000;
  --retro-diner-neon-2-2: #00FF00;
  --retro-diner-neon-2-3: #FFFF00;
  --retro-diner-neon-2-4: #0000FF;
  --retro-diner-neon-2-5: #FF8C00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-diner-neon-2": {
        1: "#FF0000",
        2: "#00FF00",
        3: "#FFFF00",
        4: "#0000FF",
        5: "#FF8C00",
      }
    }
  }
}

Related searches

retro neon color schemevibrant primary palette 50sdiner arcade colorsbold red blue green yellowpop art neon aesthetic

Palette colors

Hex values

Color 1#FF0000
·
Color 2#00FF00
·
Color 3#FFFF00
·
Color 4#0000FF
·
Color 5#FF8C00
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.9:1Fail
3.7:1AA18
2.1:1Fail
1.7:1Fail
2
2.9:1Fail
1.3:1Fail
6.3:1AA
1.7:1Fail
3
3.7:1AA18
1.3:1Fail
8:1AAA
2.2:1Fail
4
2.1:1Fail
6.3:1AA
8:1AAA
3.7:1AA18
5
1.7:1Fail
1.7:1Fail
2.2:1Fail
3.7:1AA18

Similar palettes

More like Retro Diner Neon

View all vibrant