Palette

Cosmic Dust Cloud

Mysterious and ethereal purples inspired by distant cosmic dust clouds swirling in the vastness of space.

DarkDark5 colors

More Dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#361D5C#633B9B#9962D4#C79AF8#EFD9FE

Palette guide

How to use Cosmic Dust Cloud

Overview

The Cosmic Dust Cloud palette features mysterious and ethereal purples, inspired by distant cosmic dust clouds swirling in the vastness of space. With shades ranging from the deep #361D5C to the delicate #EFD9FE, this collection offers a dark yet captivating aesthetic. Designers can leverage the strong contrast between deep and light purples to create striking visual hierarchies, perfect for conveying mystery and allure. Developers will find these hex codes ideal for crafting immersive digital experiences, from sophisticated dark mode interfaces to evocative website themes, ensuring a visually rich and engaging user journey that conveys depth and cosmic wonder across various digital platforms.

Best used for

Luxury dark mode UI/UX design
Mystical or fantasy game interfaces
High-end event or brand identity
Digital art with deep space themes
E-commerce for unique artisanal products
Fashion editorial layouts with an elegant, dark edge

Suggested color roles

primary

Designate #361D5C as a profound primary, ideal for main backgrounds, commanding headers, or foundational brand elements.

secondary

Utilize #633B9B as a rich secondary, excellent for subheadings, navigation, or larger background sections to add depth.

accent

Apply #C79AF8 as a luminous accent, perfect for interactive elements, icons, or highlights that need to draw attention gently.

background

The deep #361D5C provides an immersive dark canvas. Alternatively, #EFD9FE can serve as a delicate, ethereal background.

text

White or a very light gray provides excellent contrast on #361D5C, #633B9B, and #9962D4. Use #361D5C for text on #EFD9FE.

Accessibility notes

Ensure white text on #361D5C, #633B9B, and #9962D4 meets WCAG AA contrast standards for readability.
Avoid pairing #C79AF8 and #EFD9FE for small text due to their close values and potential low contrast; reserve for larger graphics.
The lighter shade #EFD9FE works well for subtle glow effects or as a background for darker text.
For body text on #EFD9FE, consider using #361D5C or #633B9B for better legibility than a standard black.

Recommended combinations

Dusty Depths

Combine the deepest shades for a profound background with a vibrant purple and light pink for striking text or key UI elements.

#361D5C · #633B9B · #EFD9FE

Ethereal Flow

Create smooth gradients or layered effects in UI design, mimicking the atmospheric transition of cosmic dust clouds.

#633B9B · #9962D4 · #C79AF8

Mystic Contrast

Use #EFD9FE as a light background, #361D5C for primary text, and #9962D4 for secondary information or interactive elements.

#EFD9FE · #361D5C · #9962D4

CSS variables

:root {
  --cosmic-dust-cloud-2-1: #361D5C;
  --cosmic-dust-cloud-2-2: #633B9B;
  --cosmic-dust-cloud-2-3: #9962D4;
  --cosmic-dust-cloud-2-4: #C79AF8;
  --cosmic-dust-cloud-2-5: #EFD9FE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-dust-cloud-2": {
        1: "#361D5C",
        2: "#633B9B",
        3: "#9962D4",
        4: "#C79AF8",
        5: "#EFD9FE",
      }
    }
  }
}

Hex values

Color 1#361D5C

Color 2#633B9B

Color 3#9962D4

Color 4#C79AF8

Color 5#EFD9FE

Accessibility

Contrast checker

1.8:1Fail

3.4:1AA18

6.3:1AA

10.8:1AAA

1.8:1Fail

1.9:1Fail

3.6:1AA18

6.1:1AA

3.4:1AA18

1.9:1Fail

3.2:1AA18

6.3:1AA

3.6:1AA18

1.9:1Fail

1.7:1Fail

10.8:1AAA

6.1:1AA

3.2:1AA18

1.7:1Fail

Similar palettes

More like Cosmic Dust Cloud

Cosmic Dust Cloud

See it in context.

Ready when you are.

Built with Cosmic Dust Cloud.

How to use Cosmic Dust Cloud

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Dusty Depths

Ethereal Flow

Mystic Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Cosmic Dust Cloud