Palette

Synthwave Cyberscape

Electric purples and bold pinks create a futuristic yet retro vibe, like an 80s synthwave cityscape at night.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0B003D#3E006F#8F00C2#D442FF#FFCFFF

Palette guide

How to use Synthwave Cyberscape

Overview

The Synthwave Cyberscape palette merges electric purples and bold pinks to create a futuristic yet retro vibe, reminiscent of an 80s synthwave cityscape at night. Anchored by the deep indigo of #0B003D, it transitions through the rich #3E006F and the vibrant #8F00C2. The palette culminates in the bright, energetic #D442FF and the soft, ethereal #FFCFFF. This sophisticated yet energetic scheme is perfect for designers and developers aiming to evoke a sense of digital wonder and nostalgic futurism. It's a powerful choice for projects that require a vibrant, immersive, and distinctly synthwave aesthetic.

Best used for

Retro-futuristic branding and identity design
Digital art and illustration with a neon glow
Music video aesthetics and stage lighting
Event posters and promotional graphics
Web design backgrounds and interactive elements
App interfaces and loading screens

Suggested color roles

primary

Use #0B003D as the deep, mysterious primary color, ideal for backgrounds or foundational elements that need to convey depth.

secondary

Employ #3E006F and #8F00C2 to create gradient transitions or mid-tone areas, adding visual interest and guiding the eye.

accent

Leverage #D442FF for bright, energetic highlights, calls to action, or interactive elements that demand attention.

background

Apply #0B003D as the primary background, providing a dark, immersive canvas that allows lighter colors to glow.

text

Utilize #FFCFFF for softer, readable text on dark backgrounds, or use a crisp white or light gray for general body copy to ensure clarity.

Accessibility notes

Ensure #D442FF and #FFCFFF have sufficient contrast against #0B003D and #3E006F for all text and UI elements (WCAG AA).
Avoid using #8F00C2 on #3E006F for small text, as the contrast might be too low for optimal readability.
For critical text, consider using larger font sizes or increased weight when pairing mid-tone purples.
Always verify color contrast ratios using a WCAG compliance checker, especially for interactive components.

Recommended combinations

Deep Cyberscape

A gradient from deep indigo to rich purple, highlighted by a vibrant pink for depth and energetic focus.

#0B003D · #3E006F · #D442FF

Retro Glow

A bright, ethereal combination for glowing elements, soft gradients, or dreamy visual effects.

#8F00C2 · #D442FF · #FFCFFF

Electric City

Dark base with a vibrant purple middle ground and a soft pink highlight, ideal for UI elements or graphic accents.

#0B003D · #8F00C2 · #FFCFFF

CSS variables

:root {
  --synthwave-cyberscape-1: #0B003D;
  --synthwave-cyberscape-2: #3E006F;
  --synthwave-cyberscape-3: #8F00C2;
  --synthwave-cyberscape-4: #D442FF;
  --synthwave-cyberscape-5: #FFCFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "synthwave-cyberscape": {
        1: "#0B003D",
        2: "#3E006F",
        3: "#8F00C2",
        4: "#D442FF",
        5: "#FFCFFF",
      }
    }
  }
}

Hex values

Color 1#0B003D

Color 2#3E006F

Color 3#8F00C2

Color 4#D442FF

Color 5#FFCFFF

Accessibility

Contrast checker

1.3:1Fail

2.7:1Fail

5.6:1AA

14.4:1AAA

1.3:1Fail

2.1:1Fail

4.2:1AA18

10.9:1AAA

2.7:1Fail

2.1:1Fail

2:1Fail

5.3:1AA

5.6:1AA

4.2:1AA18

2:1Fail

2.6:1Fail

14.4:1AAA

10.9:1AAA

5.3:1AA

2.6:1Fail

Similar palettes

More like Synthwave Cyberscape

View all vibrant

Cyber Glow Graffiti

Cyber Grid Flash

Cybernetic Circuit Glow

Cyberpunk Alley Neon

Cyberpunk Electric Surge

Electric Circuit Board