Palette

Cybernetic Spectrum Surge

An electrifying burst of futuristic colors, reminiscent of glowing data streams and cyberpunk cityscapes.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cybernetic Spectrum Surge 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 Cybernetic Spectrum Surge.

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

Data visualization

#1C0E47#5E288F#FF00FF#00FFFF#00FF00

Palette guide

How to use Cybernetic Spectrum Surge

Overview

The Cybernetic Spectrum Surge palette is an electrifying burst of futuristic colors, reminiscent of glowing data streams and cyberpunk cityscapes. It features a profound dark indigo (#1C0E47) and a rich, deep purple (#5E288F) as its base, dramatically contrasted by an intense magenta (#FF00FF), brilliant electric cyan (#00FFFF), and a vibrant green (#00FF00). This palette is designed for designers and developers to create high-impact, dynamic, and visually arresting experiences. Its combination of deep, atmospheric foundations and luminous neon accents is perfect for conveying energy, digital innovation, and a cutting-edge aesthetic that captures attention.

Best used for

Cyberpunk game UIs and environment lighting
Digital art and motion graphics with a tech-noir feel
Esports branding and live streaming graphics
Tech product launches and advertising campaigns
Interactive installations and projection mapping
Event promotions for electronic music or tech festivals

Suggested color roles

primary

Use #FF00FF (Intense Magenta) for main interactive elements, key highlights, or primary branding that needs to convey power and excitement.

secondary

Apply #00FFFF (Electric Cyan) for secondary calls-to-action, data visualizations, or to create a cool, high-tech contrast.

accent

Reserve #00FF00 (Vibrant Green) for success indicators, subtle glows, or to add a refreshing, data-stream feel.

background

Utilize #1C0E47 (Dark Indigo) as the foundational dark canvas, providing a stark contrast that makes the neon colors truly burst and glow.

text

Pair #00FFFF (Electric Cyan) or #00FF00 (Vibrant Green) for headings; use white for general body text on dark backgrounds.

Accessibility notes

Ensure high contrast for text; #00FFFF and #00FF00 on #1C0E47 are generally good, but check #FF00FF on #1C0E47 for smaller text.
Avoid using #FF00FF and #5E288F in close proximity for critical information if color is the sole differentiator, due to their similar hue family and potential for color blindness issues.
Use #1C0E47 provides an excellent dark background for lighter, luminous text, ensuring good readability.
For critical information, always provide alternative visual cues (icons, underlines) in addition to color.

Recommended combinations

Data Stream

A dark background with deep purple for subtle structural elements and electric cyan for main data flows.

#1C0E47 · #5E288F · #00FFFF

Spectrum Burst

Combine these three neons for dynamic animations, loading indicators, or energetic transitions, representing a digital surge.

#FF00FF · #00FFFF · #00FF00

Future Glow

Use for UI elements, with dark indigo as the base, green for display elements, and magenta for interactive controls.

#1C0E47 · #00FF00 · #FF00FF

CSS variables

:root {
  --cybernetic-spectrum-surge-1: #1C0E47;
  --cybernetic-spectrum-surge-2: #5E288F;
  --cybernetic-spectrum-surge-3: #FF00FF;
  --cybernetic-spectrum-surge-4: #00FFFF;
  --cybernetic-spectrum-surge-5: #00FF00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cybernetic-spectrum-surge": {
        1: "#1C0E47",
        2: "#5E288F",
        3: "#FF00FF",
        4: "#00FFFF",
        5: "#00FF00",
      }
    }
  }
}

Hex values

Color 1#1C0E47

Color 2#5E288F

Color 3#FF00FF

Color 4#00FFFF

Color 5#00FF00

Accessibility

Contrast checker

1.8:1Fail

5.6:1AA

13.9:1AAA

12.7:1AAA

1.8:1Fail

3.1:1AA18

7.7:1AAA

7:1AAA

5.6:1AA

3.1:1AA18

2.5:1Fail

2.3:1Fail

13.9:1AAA

7.7:1AAA

2.5:1Fail

1.1:1Fail

12.7:1AAA

7:1AAA

2.3:1Fail

1.1:1Fail

Similar palettes

More like Cybernetic Spectrum Surge

View all vibrant

Cyber Neon Glitch

Digital Plasma Burst

Electric Circuit Flow

Electro Arcade Surge

Neon City Pulse

Neon Jungle Pulse