Palette

Future Metropolis Pulse

Inspired by the futuristic glow and intricate networks of a bustling, advanced metropolis.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Future Metropolis Pulse 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 Future Metropolis Pulse.

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

Data visualization

#00BFFF#FF3399#8A2BE2#00FF00#1C1C1C

Palette guide

How to use Future Metropolis Pulse

Overview

The "Future Metropolis Pulse" is an electrifying and dynamic palette, perfectly capturing the high-energy, neon-lit essence of a futuristic city. It combines striking brights—a cool sky blue #00BFFF, a vibrant magenta #FF3399, a deep violet #8A2BE2, and a sharp lime green #00FF00—against a grounding, dark #1C1C1C. This palette is a playground for designers and developers looking to create impactful, modern, and energetic visuals. It’s ideal for projects that demand a bold statement, evoking themes of technology, innovation, and urban nightlife with a clear, pulsating rhythm.

Best used for

Cyberpunk game aesthetics
EDM or club event promotions
High-tech product launches
Animated motion graphics
Futuristic UI/UX design
Urban streetwear branding

Suggested color roles

primary

#00BFFF - A vibrant, energetic blue, excellent for main headings, prominent interactive elements, or backgrounds that need to feel expansive and digital.

secondary

#FF3399 - A bold, eye-catching magenta, perfect for secondary accents, call-to-action buttons, or to create a strong visual contrast.

accent

#00FF00 - A sharp, neon green, providing a high-impact accent for notifications, loading bars, or critical interactive elements, symbolizing digital life.

background

#1C1C1C - A deep, almost black charcoal, serving as the foundational canvas that makes the neon brights truly pop and glow.

text

#8A2BE2 - A rich violet, suitable for subheadings or secondary text on dark backgrounds, offering a unique glowing effect, or use white for body text for optimal legibility.

Accessibility notes

Ensure all bright colors (#00BFFF, #FF3399, #00FF00, #8A2BE2) have sufficient contrast when used for text or interactive elements on the dark #1C1C1C background.
Avoid placing similar bright colors next to each other without enough contrast for legibility, e.g., #FF3399 text on #8A2BE2 background.
For body text on #1C1C1C, a light grey or white is often more readable than a vibrant color for extended reading.
Interactive elements should use distinct colors for different states to avoid confusion and enhance usability.

Recommended combinations

Neon Grid

Ideal for cyberpunk-themed interfaces, using #1C1C1C as the base, #00BFFF for primary UI, and #FF3399 for alerts or highlights.

#1C1C1C · #00BFFF · #FF3399

Digital Pulse

Great for motion graphics or dynamic branding, with the green and violet creating a vibrant, energetic glow against the dark.

#00FF00 · #8A2BE2 · #1C1C1C

Urban Glow

Excellent for marketing materials or event posters, combining these three brights for a striking, multi-color neon effect.

#FF3399 · #00BFFF · #8A2BE2

CSS variables

:root {
  --future-metropolis-pulse-1: #00BFFF;
  --future-metropolis-pulse-2: #FF3399;
  --future-metropolis-pulse-3: #8A2BE2;
  --future-metropolis-pulse-4: #00FF00;
  --future-metropolis-pulse-5: #1C1C1C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "future-metropolis-pulse": {
        1: "#00BFFF",
        2: "#FF3399",
        3: "#8A2BE2",
        4: "#00FF00",
        5: "#1C1C1C",
      }
    }
  }
}

Hex values

Color 1#00BFFF

Color 2#FF3399

Color 3#8A2BE2

Color 4#00FF00

Color 5#1C1C1C

Accessibility

Contrast checker

1.6:1Fail

2.8:1Fail

1.5:1Fail

8:1AAA

1.6:1Fail

1.8:1Fail

2.5:1Fail

5:1AA

2.8:1Fail

1.8:1Fail

4.3:1AA18

2.9:1Fail

1.5:1Fail

2.5:1Fail

4.3:1AA18

12.4:1AAA

8:1AAA

5:1AA

2.9:1Fail

12.4:1AAA

Similar palettes

More like Future Metropolis Pulse

View all vibrant

Cybernetic Glow Grid

Cybernetic Street Grid

Cyberpunk Neon Blaze

Cyberpunk Sunset

Electric Future Pulse

Neo-Futuristic Pulse