Back to palettes

Palette

Cosmic Nebula Swirl

Inspired by the breathtaking and swirling colors of distant nebulae in the vast cosmos.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#191970#483D8B#8A2BE2#C71585#4169E1

Palette guide

How to use Cosmic Nebula Swirl

Overview

The Cosmic Nebula Swirl palette is inspired by the breathtaking and swirling colors of distant nebulae in the vast cosmos. It anchors with the deep #191970 (dark indigo) and the profound #483D8B (dark slate blue). The palette then introduces the vibrant #8A2BE2 (blue-violet) and the striking #4169E1 (royal blue), punctuated by the intense #C71585 (deep pink). This dark and mysterious collection is perfect for designers and developers crafting immersive, sophisticated, or fantastical digital experiences. It excels in creating atmospheric backgrounds, dynamic UI elements, and branding that conveys depth, wonder, and a touch of cosmic drama.

Best used for

  • Mysterious game environments and sci-fi interfaces
  • Sophisticated digital art and abstract illustrations
  • Elegant event branding and invitations
  • High-end tech product marketing materials
  • Cinematic title sequences and visual effects
  • Dark mode app interfaces with a celestial theme

Suggested color roles

primary

Utilize #191970 as a deep, anchoring background color, providing a stable, dark canvas for the swirling nebula hues.

secondary

Employ #483D8B or #4169E1 for significant content areas, subheadings, or distinct sections, offering rich, supporting blue tones.

accent

Apply #C71585 for high-impact calls-to-action, alerts, or to highlight key interactive features with intense, glowing vibrancy.

background

The darker blues like #191970 and #483D8B are perfect for expansive, dark backgrounds, allowing the brighter colors to create a sense of depth and shimmer.

text

On dark backgrounds like #191970 or #483D8B, use white or a very light gray for body text. On lighter blues, a deep charcoal or black offers contrast, though white often maintains the ethereal feel.

Accessibility notes

  • Ensure strong contrast when using #C71585 for text against #191970 or #483D8B.
  • White text on #191970, #483D8B, #8A2BE2, and #4169E1 generally provides good readability.
  • Avoid using #8A2BE2 as a text color on #483D8B due to potential low contrast; reserve for larger headlines or accents.
  • Test color combinations for different forms of colorblindness, as blues and purples can sometimes be challenging.

Recommended combinations

Deep Nebula Core

Creates a rich, evolving blue gradient, ideal for atmospheric backgrounds or elegant, layered UI components.

#191970 · #483D8B · #4169E1

Cosmic Bloom

Perfect for vibrant accents, interactive elements, or conveying a luminous, ethereal glow in illustrations and decorative elements.

#483D8B · #8A2BE2 · #C71585

Stellar Flare

Excellent for establishing clear visual hierarchy, with bright, pulsating accents against a deep, mysterious backdrop.

#191970 · #C71585 · #4169E1

CSS variables

:root {
  --cosmic-nebula-swirl-1: #191970;
  --cosmic-nebula-swirl-2: #483D8B;
  --cosmic-nebula-swirl-3: #8A2BE2;
  --cosmic-nebula-swirl-4: #C71585;
  --cosmic-nebula-swirl-5: #4169E1;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-nebula-swirl": {
        1: "#191970",
        2: "#483D8B",
        3: "#8A2BE2",
        4: "#C71585",
        5: "#4169E1",
      }
    }
  }
}

Related searches

dark space colorsmysterious nebula palettepurple blue cosmic themegalaxy ui designdeep blue pink palette

Palette colors

Hex values

Color 1#191970
·
Color 2#483D8B
·
Color 3#8A2BE2
·
Color 4#C71585
·
Color 5#4169E1
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
2.7:1Fail
3.1:1AA18
2
1.6:1Fail
1.5:1Fail
1.7:1Fail
1.9:1Fail
3
2.5:1Fail
1.5:1Fail
1.1:1Fail
1.2:1Fail
4
2.7:1Fail
1.7:1Fail
1.1:1Fail
1.1:1Fail
5
3.1:1AA18
1.9:1Fail
1.2:1Fail
1.1:1Fail

Similar palettes

More like Cosmic Nebula Swirl

View all dark