Palette

Celestial Dust Swirl

Deep space blacks and cosmic purples swirl with nebular blues, evoking distant galaxies and stardust.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Celestial Dust 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 Celestial Dust Swirl.

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

Data visualization

#000000#191970#4B0082#6A5ACD#B0C4DE

Palette guide

How to use Celestial Dust Swirl

Overview

The Celestial Dust Swirl palette plunges into the depths of space, where deep blacks and cosmic purples swirl with nebular blues. Featuring absolute #000000, the profound #191970 and #4B0082, and the softer #6A5ACD and #B0C4DE, this collection evokes distant galaxies and stardust. It's ideal for designers and developers aiming to create dark, mysterious, and immersive digital experiences, branding, or interfaces. Its powerful contrast and rich, deep hues provide a dramatic yet elegant foundation for projects that require a strong, captivating visual presence.

Best used for

Sci-fi game interfaces and concept art
Luxury automotive branding
High-end tech product launches
Dark mode web applications
Mysterious event promotions
Astronomy-focused educational content

Suggested color roles

primary

#000000 serves as the ultimate dark background, establishing a profound, infinite space.

secondary

#191970 or #4B0082 are excellent for main sections, navigation, or card backgrounds, adding rich color to the darkness.

accent

#B0C4DE provides a soft, luminous highlight, perfect for interactive elements, calls to action, or subtle glowing effects.

background

#000000 is the dominant background, creating a true dark mode experience.

text

#B0C4DE or #6A5ACD ensures excellent readability against the dark backgrounds. A near-white is also suitable.

Accessibility notes

#B0C4DE offers strong contrast for text on #000000, #191970, and #4B0082, meeting WCAG AA standards.
Be cautious when using #6A5ACD for small text on #4B0082; ensure sufficient contrast.
Ensure interactive elements using lighter shades have clear focus and hover states against the deep backgrounds.
This palette is well-suited for high-contrast dark mode designs, promoting readability.

Recommended combinations

Deep Cosmos

A powerful dark mode setup with bright text and a rich purple accent.

#000000 · #B0C4DE · #4B0082

Nebular Gradient

Ideal for background fills or hero sections, creating a smooth, mysterious transition.

#191970 · #4B0082 · #6A5ACD

Galactic Highlight

Use #B0C4DE for prominent interactive elements or headings against dark backgrounds.

#B0C4DE · #000000 · #191970

CSS variables

:root {
  --celestial-dust-swirl-2-1: #000000;
  --celestial-dust-swirl-2-2: #191970;
  --celestial-dust-swirl-2-3: #4B0082;
  --celestial-dust-swirl-2-4: #6A5ACD;
  --celestial-dust-swirl-2-5: #B0C4DE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-dust-swirl-2": {
        1: "#000000",
        2: "#191970",
        3: "#4B0082",
        4: "#6A5ACD",
        5: "#B0C4DE",
      }
    }
  }
}

Hex values

Color 1#000000

Color 2#191970

Color 3#4B0082

Color 4#6A5ACD

Color 5#B0C4DE

Accessibility

Contrast checker

1.4:1Fail

1.6:1Fail

4:1AA18

11.8:1AAA

1.4:1Fail

1.1:1Fail

2.8:1Fail

8.3:1AAA

1.6:1Fail

1.1:1Fail

2.4:1Fail

7.3:1AAA

4:1AA18

2.8:1Fail

2.4:1Fail

3:1Fail

11.8:1AAA

8.3:1AAA

7.3:1AAA

3:1Fail

Similar palettes

More like Celestial Dust Swirl

Cosmic Stardust Drift

Cosmic Vapour Trails