Back to palettes

Palette

Galactic Nebula Swirl

A fantastical blend of deep purples, electric blues, and pinks, portraying distant, swirling nebulae.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Galactic Nebula Swirl 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 Galactic Nebula Swirl.

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

Data visualization

#483D8B#8A2BE2#FF00FF#00FFFF#191970

Palette guide

How to use Galactic Nebula Swirl

Overview

The "Galactic Nebula Swirl" palette offers a captivating journey into deep space with its rich blend of purples and electric blues. Anchored by the profound #191970 (Midnight Blue) and the regal #483D8B (Dark Slate Blue), this palette evokes the mystery of the cosmos. Vibrant accents like the dazzling #FF00FF (Fuchsia) and the luminous #00FFFF (Aqua) cut through the darkness, mimicking distant nebulae and stellar explosions. This guide helps designers and developers harness its dramatic potential for immersive digital experiences, ensuring a cohesive and visually striking aesthetic. It’s perfect for projects requiring a sense of wonder, depth, and futuristic energy.

Best used for

  • Sci-fi video game interfaces and environments
  • Digital art and abstract cosmic illustrations
  • Event branding for music festivals or tech conferences
  • Website and app themes with a futuristic or mystical vibe
  • Fashion or product design targeting a bold, edgy aesthetic
  • Visual effects for film or animation sequences

Suggested color roles

primary

#191970 (Midnight Blue) serves as a deep, stable foundation, ideal for large background areas, main navigation, or primary branding elements that require a sense of gravitas and depth.

secondary

#483D8B (Dark Slate Blue) provides a rich supporting hue, excellent for secondary navigation, card backgrounds, or distinct content blocks, offering a sophisticated contrast to the primary.

accent

#FF00FF (Fuchsia) is a powerful, electric accent, perfect for calls-to-action, interactive elements, progress indicators, or highlights that demand immediate attention and vibrant energy.

background

#191970 (Midnight Blue) creates an immersive, dark canvas, allowing the brighter colors to pop and enhancing the sense of cosmic depth for overall page or application backgrounds.

text

For headings and key information, use #00FFFF (Aqua) to stand out against dark backgrounds. For body text, a simple white or light gray (e.g., #EEEEEE) ensures optimal readability.

Accessibility notes

  • Ensure #FF00FF and #00FFFF have sufficient contrast when used as text or interactive elements against #191970 or #483D8B.
  • Avoid using #FF00FF text on #00FFFF backgrounds (or vice-versa) due to extremely low contrast and potential for visual strain.
  • Prioritize white or near-white text for body content over vibrant accents to maintain readability on dark backgrounds.
  • Verify all color pairings meet WCAG AA or AAA contrast standards, especially for interactive components and critical information.

Recommended combinations

Deep Nebula

Ideal for hero sections or main landing pages, using the deep blues as a base and fuchsia for powerful calls-to-action.

#191970 · #483D8B · #FF00FF

Cosmic Glow

Excellent for data visualizations, progress bars, or UI elements where a gradient-like transition from purple to aqua signifies progress or related states.

#483D8B · #8A2BE2 · #00FFFF

Stellar Contrast

Best for minimalist interfaces, using a deep background with bright aqua for primary text/icons and amethyst for secondary information or decorative elements.

#191970 · #00FFFF · #8A2BE2

CSS variables

:root {
  --galactic-nebula-swirl-4-1: #483D8B;
  --galactic-nebula-swirl-4-2: #8A2BE2;
  --galactic-nebula-swirl-4-3: #FF00FF;
  --galactic-nebula-swirl-4-4: #00FFFF;
  --galactic-nebula-swirl-4-5: #191970;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "galactic-nebula-swirl-4": {
        1: "#483D8B",
        2: "#8A2BE2",
        3: "#FF00FF",
        4: "#00FFFF",
        5: "#191970",
      }
    }
  }
}

Related searches

dark space color schemevibrant purple blue palettecosmic ui colorssci-fi color guidenight sky color inspiration

Palette colors

Hex values

Color 1#483D8B
·
Color 2#8A2BE2
·
Color 3#FF00FF
·
Color 4#00FFFF
·
Color 5#191970
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.9:1Fail
7.2:1AAA
1.6:1Fail
2
1.5:1Fail
1.9:1Fail
4.8:1AA
2.5:1Fail
3
2.9:1Fail
1.9:1Fail
2.5:1Fail
4.7:1AA
4
7.2:1AAA
4.8:1AA
2.5:1Fail
11.8:1AAA
5
1.6:1Fail
2.5:1Fail
4.7:1AA
11.8:1AAA

Similar palettes

More like Galactic Nebula Swirl

View all dark