Palette

Cosmic Galaxy Dust

A deep and mysterious array of purples and blues, evoking the swirling dust clouds of distant galaxies.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1E1A2A#3A2E4C#5C4A70#8A6DA0#B892D0

Palette guide

How to use Cosmic Galaxy Dust

Overview

The Cosmic Galaxy Dust palette offers a deep and mysterious array of purples and blues, evoking the swirling dust clouds of distant galaxies. Ranging from the profound #1E1A2A to the delicate #B892D0, this collection is perfect for designers creating dark, ethereal, and visually intriguing digital experiences. It's particularly suitable for sci-fi game interfaces, abstract art, or branding that seeks to convey wonder and depth. Developers can integrate these versatile hex codes, such as the rich #5C4A70, to build visually compelling applications and websites, ensuring a consistent and enchanting user experience across various digital platforms.

Best used for

Sci-fi game environments
Abstract digital art
Mysterious brand identity
Ethereal photography showcases
Conceptual website designs
Dark mode UI/UX

Suggested color roles

primary

#3A2E4C - A deep, grounding purple-blue that serves as an excellent base for large sections or main content areas.

secondary

#5C4A70 - A rich mid-tone purple, suitable for secondary information, interactive components, or subtle data visualization.

accent

#8A6DA0 - A lighter, more luminous purple, ideal for drawing attention to calls to action, highlights, or subtle glow effects.

background

#1E1A2A - The deepest, most enveloping shade, creating a profound and immersive backdrop for all other elements.

text

#B892D0 or white - Provides clear readability and a soft glow against the darker shades within the palette.

Accessibility notes

Ensure sufficient contrast for text, especially when using #5C4A70 on #3A2E4C.
Always use #B892D0 or white for body text on #1E1A2A and #3A2E4C to meet WCAG AA standards.
Be cautious with contrast when layering #8A6DA0 over #5C4A70 for crucial UI elements.
Test interactive elements for adequate contrast to ensure usability for users with visual impairments.

Recommended combinations

Nebula Depth

Creates a layered, atmospheric background perfect for conveying depth and mystery in digital interfaces or art.

#1E1A2A · #3A2E4C · #5C4A70

Ethereal Glimmer

Ideal for highlighting key information or interactive elements, providing a soft, ethereal shimmer.

#3A2E4C · #8A6DA0 · #B892D0

Cosmic Contrast

Excellent for establishing clear visual hierarchy, separating content blocks with a dark base and light accents.

#1E1A2A · #5C4A70 · #B892D0

CSS variables

:root {
  --cosmic-galaxy-dust-1: #1E1A2A;
  --cosmic-galaxy-dust-2: #3A2E4C;
  --cosmic-galaxy-dust-3: #5C4A70;
  --cosmic-galaxy-dust-4: #8A6DA0;
  --cosmic-galaxy-dust-5: #B892D0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-galaxy-dust": {
        1: "#1E1A2A",
        2: "#3A2E4C",
        3: "#5C4A70",
        4: "#8A6DA0",
        5: "#B892D0",
      }
    }
  }
}

Hex values

Color 1#1E1A2A

Color 2#3A2E4C

Color 3#5C4A70

Color 4#8A6DA0

Color 5#B892D0

Accessibility

Contrast checker

1.4:1Fail

2.2:1Fail

3.9:1AA18

6.5:1AA

1.4:1Fail

1.6:1Fail

2.9:1Fail

4.8:1AA

2.2:1Fail

1.6:1Fail

1.8:1Fail

3:1AA18

3.9:1AA18

2.9:1Fail

1.8:1Fail

1.7:1Fail

6.5:1AA

4.8:1AA

3:1AA18

1.7:1Fail

Similar palettes

More like Cosmic Galaxy Dust

Midnight Starfall Gaze

Celestial Abyss Gaze