Palette

Synthwave Circuit City

High-contrast, glowing neons electrifying dark cityscapes, pulsating with the vibrant energy of a synthwave future.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Synthwave Circuit City 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 Synthwave Circuit City.

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

Data visualization

#FF00C4#00FFFF#8A2BE2#00FF00#333333

Palette guide

How to use Synthwave Circuit City

Overview

The Synthwave Circuit City palette pulsates with high-contrast, glowing neons, electrifying dark cityscapes with the vibrant energy of a synthwave future. Featuring an electric magenta #FF00C4, a striking cyan #00FFFF, a bold purple #8A2BE2, a sharp lime green #00FF00, and a grounding dark grey #333333, this collection is genuinely useful for designers and developers seeking an energetic, retro-futuristic, and digitally-inspired aesthetic. These colors are excellent for gaming interfaces, tech branding, or any project needing to convey speed, innovation, and a distinct 80s cyberpunk vibe. It's a versatile mix that promises to create visually impactful and dynamic user experiences.

Best used for

Gaming interfaces and esports branding
Tech and software company branding
Music event promotions and club visuals
Digital art and retro-futuristic illustrations
Cyberpunk-themed websites and applications
Energetic social media content

Suggested color roles

primary

Utilize #333333 as a grounding dark primary color for backgrounds, main content areas, or structural elements, setting a nocturnal stage.

secondary

Employ #FF00C4 for prominent headlines, interactive elements, or key graphic features, demanding attention with its electric glow.

accent

Introduce #00FFFF and #00FF00 as vibrant accents for calls to action, highlights, or data visualizations, providing stark, energetic contrast.

background

The deep #333333 makes an ideal dark, immersive background, allowing the neon colors to truly pop and create a sense of depth.

text

Pair with white or a light shade of #00FFFF or #FF00C4 for optimal readability on dark backgrounds, ensuring a futuristic, glowing effect.

Accessibility notes

Prioritize high contrast for text; always use light text (white or light neon) on the dark #333333 background.
Avoid using neon colors like #FF00C4 or #00FF00 for large blocks of body text, as their intensity can cause eye strain.
Ensure interactive elements have clear hover/focus states, as the vibrant colors might be overwhelming without clear feedback.
Be cautious when pairing neon colors directly against each other; use #333333 as a separator or background for readability.

Recommended combinations

Cyber Night

Excellent for creating a dramatic, high-contrast base for hero sections, main navigation, or impactful visual elements.

#333333 · #FF00C4 · #00FFFF

Circuit Glow

Perfect for highlighting data, interactive components, or decorative lines that need to convey digital energy and vibrancy.

#00FFFF · #00FF00 · #8A2BE2

Synthwave Punch

Use for calls to action, alert messages, or elements that require maximum visibility and an unmistakable retro-futuristic flair.

#333333 · #FF00C4 · #00FF00

CSS variables

:root {
  --synthwave-circuit-city-1: #FF00C4;
  --synthwave-circuit-city-2: #00FFFF;
  --synthwave-circuit-city-3: #8A2BE2;
  --synthwave-circuit-city-4: #00FF00;
  --synthwave-circuit-city-5: #333333;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "synthwave-circuit-city": {
        1: "#FF00C4",
        2: "#00FFFF",
        3: "#8A2BE2",
        4: "#00FF00",
        5: "#333333",
      }
    }
  }
}

Hex values

Color 1#FF00C4

Color 2#00FFFF

Color 3#8A2BE2

Color 4#00FF00

Color 5#333333

Accessibility

Contrast checker

2.8:1Fail

1.7:1Fail

2.5:1Fail

3.6:1AA18

2.8:1Fail

4.8:1AA

1.1:1Fail

10.1:1AAA

1.7:1Fail

4.8:1AA

4.3:1AA18

2.1:1Fail

2.5:1Fail

1.1:1Fail

4.3:1AA18

9.2:1AAA

3.6:1AA18

10.1:1AAA

2.1:1Fail

9.2:1AAA

Similar palettes

More like Synthwave Circuit City

View all vibrant

Digital Synthwave Horizon

Electric Sunset Vapor

Synthwave Digital Dream

Abstract Pop Glitch

Cyberpunk Electric Surge

Digital Pixel Bloom