Back to palettes

Palette

Electric Neon Dream

Dazzling, high-contrast colors ignite an energetic, futuristic, and playful atmosphere.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Electric Neon Dream 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 Electric Neon Dream.

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

Data visualization

#FF00FF#00FFFF#FFFF00#FF0000#00FF00

Palette guide

How to use Electric Neon Dream

Overview

The Electric Neon Dream palette ignites an energetic, futuristic, and playful atmosphere with dazzling, high-contrast colors. It features the bold #FF00FF (Magenta), electric #00FFFF (Cyan), luminous #FFFF00 (Yellow), vibrant #FF0000 (Red), and a striking #00FF00 (Lime Green). This collection is built on primary and secondary additive colors, creating an immediate sense of digital energy and clarity. Designers can leverage these hues for stark contrasts, glowing UI elements, or data visualization that demands attention and conveys a retro-futuristic vibe. Developers will find this palette excellent for creating dynamic user experiences in applications, websites, or games that require a distinctly modern and playful feel.

Best used for

  • Retro arcade game interfaces
  • 80s-themed party promotions
  • Vaporwave aesthetic projects
  • Children's educational apps
  • Pop art illustrations
  • Dynamic website heroes

Suggested color roles

primary

#FF00FF (Magenta) - A powerful, energetic hue ideal for primary calls-to-action, brand highlights, or dominant graphical elements.

secondary

#00FFFF (Cyan) - Provides a cool, electric balance, perfect for secondary interactive elements, subheadings, or background accents.

accent

#FFFF00 (Yellow) - A luminous, attention-grabbing accent for alerts, notifications, or critical information that needs immediate visibility.

background

#FF0000 (Red) - A bold and energetic background that can command attention, best used sparingly. For a more versatile background, consider a dark grey like #1A1A1A or black.

text

#00FF00 (Lime Green) - Effective for high-impact headlines or short, urgent messages. For body text, use black or dark gray on lighter backgrounds, or white on darker backgrounds like a deep blue or black.

Accessibility notes

  • Ensure high contrast when pairing #FFFF00 with any light background; it's best on dark colors like black or #FF0000.
  • Avoid using #FF00FF, #00FFFF, #FFFF00, #FF0000, or #00FF00 for small body text due to their intensity and potential for eye strain.
  • When using #FF0000 as a background, ensure text colors (e.g., white or black) meet WCAG contrast ratios.
  • Prioritize dark text (e.g., #1A1A1A) on #FFFF00, and white text on #FF00FF or #00FFFF for optimal readability.

Recommended combinations

CMYK Pop

The classic CMY combination, perfect for creating dynamic digital effects, glowing UI elements, or vibrant abstract art with a retro feel.

#FF00FF · #00FFFF · #FFFF00

Arcade Glow

Ideal for warnings, notifications, or interactive elements that need to stand out with a clear, energetic signal, reminiscent of arcade games.

#FF0000 · #00FF00 · #FFFF00

Neon Burst

A high-energy trio for gaming interfaces, event posters, or any design requiring a bold, electric, and modern feel with maximum impact.

#00FFFF · #FF00FF · #FF0000

CSS variables

:root {
  --electric-neon-dream-1: #FF00FF;
  --electric-neon-dream-2: #00FFFF;
  --electric-neon-dream-3: #FFFF00;
  --electric-neon-dream-4: #FF0000;
  --electric-neon-dream-5: #00FF00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "electric-neon-dream": {
        1: "#FF00FF",
        2: "#00FFFF",
        3: "#FFFF00",
        4: "#FF0000",
        5: "#00FF00",
      }
    }
  }
}

Related searches

neon retro color paletteelectric vibrant designhigh contrast pop artfuturistic game colorsbold 80s aesthetic

Palette colors

Hex values

Color 1#FF00FF
·
Color 2#00FFFF
·
Color 3#FFFF00
·
Color 4#FF0000
·
Color 5#00FF00
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.5:1Fail
2.9:1Fail
1.3:1Fail
2.3:1Fail
2
2.5:1Fail
1.2:1Fail
3.2:1AA18
1.1:1Fail
3
2.9:1Fail
1.2:1Fail
3.7:1AA18
1.3:1Fail
4
1.3:1Fail
3.2:1AA18
3.7:1AA18
2.9:1Fail
5
2.3:1Fail
1.1:1Fail
1.3:1Fail
2.9:1Fail

Similar palettes

More like Electric Neon Dream

View all vibrant
Neon Retro Gradient
Neon Synthwave Wave
Arcade Game Flash
Cyber Grid Flash
Cybernetic City Pulse
Cybernetic Glitch Flow