Palette

Stellar Dust Cloud

Swirls of deep purples and shimmering lavenders capture the ethereal beauty of a distant stellar dust cloud.

DarkDark5 colors

More Dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Stellar Dust Cloud 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 Stellar Dust Cloud.

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

Data visualization

#1F0D3A#4A1D72#7B2ED4#B17DED#E6CCFF

Palette guide

How to use Stellar Dust Cloud

Overview

The Stellar Dust Cloud palette captures the ethereal beauty of a distant stellar dust cloud with swirls of deep purples and shimmering lavenders. This mysterious collection features a profound dark indigo #1F0D3A, rich purples like #4A1D72 and #7B2ED4, and soft, luminous lavenders such as #B17DED and #E6CCFF. Designers can leverage these hex codes to create captivating digital illustrations, mystical branding, or immersive UI experiences that evoke wonder and depth. Developers will find this palette ideal for crafting visually stunning dark mode themes, fantasy game interfaces, or applications that aim to convey mystery, sophistication, and an otherworldly, magical aesthetic.

Best used for

Fantasy game interfaces
Mystical or spiritual branding
Dark mode UI/UX design
Digital art and illustration
Luxury product packaging
Event promotion for music or arts

Suggested color roles

primary

#1F0D3A - A very deep, dark indigo, serving as a powerful background or primary color for bold elements.

secondary

#4A1D72 - A rich, deep purple, suitable for secondary backgrounds, content panels, or subtle divisions.

accent

#7B2ED4 - A vibrant, electric purple, providing a striking accent for calls-to-action, highlights, or key information.

background

#B17DED - A soft, luminous lavender that can act as a unifying background for lighter content, or for layering.

text

#E6CCFF - A very light, shimmering lavender that offers excellent readability on darker backgrounds, or use white text on darkest tones.

Accessibility notes

Ensure #E6CCFF text on #1F0D3A or #4A1D72 provides sufficient contrast for readability.
Avoid using #B17DED for small text on #7B2ED4 as contrast will be poor.
For interactive elements, provide clear focus states using a distinct hue, or a darker/lighter shade from the palette.
Use a contrast checker tool to verify all text and interactive element color combinations, especially for lighter purples.

Recommended combinations

Cosmic Depths

Establishes a dark, mysterious base with luminous light text and a vibrant purple accent for key interactive elements.

#1F0D3A · #E6CCFF · #7B2ED4

Ethereal Glow

Creates a soft, glowing gradient for backgrounds or cards, evoking the appearance of distant, shimmering dust clouds.

#4A1D72 · #B17DED · #E6CCFF

Purple Majesty

Ideal for creating depth and sophistication, using vibrant purple for primary elements against darker purple backgrounds.

#7B2ED4 · #4A1D72 · #1F0D3A

CSS variables

:root {
  --stellar-dust-cloud-1: #1F0D3A;
  --stellar-dust-cloud-2: #4A1D72;
  --stellar-dust-cloud-3: #7B2ED4;
  --stellar-dust-cloud-4: #B17DED;
  --stellar-dust-cloud-5: #E6CCFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "stellar-dust-cloud": {
        1: "#1F0D3A",
        2: "#4A1D72",
        3: "#7B2ED4",
        4: "#B17DED",
        5: "#E6CCFF",
      }
    }
  }
}

Hex values

Color 1#1F0D3A

Color 2#4A1D72

Color 3#7B2ED4

Color 4#B17DED

Color 5#E6CCFF

Accessibility

Contrast checker

1.5:1Fail

2.7:1Fail

6:1AA

12.3:1AAA

1.5:1Fail

1.9:1Fail

4.1:1AA18

8.4:1AAA

2.7:1Fail

1.9:1Fail

2.2:1Fail

4.5:1AA

6:1AA

4.1:1AA18

2.2:1Fail

2.1:1Fail

12.3:1AAA

8.4:1AAA

4.5:1AA

2.1:1Fail

Similar palettes

More like Stellar Dust Cloud

View all Dark

Deep Space Nebula

Galactic Nebula Haze

Midnight Bloom Velvet

Abyssal Bioluminescence

Cosmic Dust Cloud

Deep Forest Murmur