Palette

Cosmic Dust Shimmer

A mystical journey through purples and lavenders, mirroring shimmering cosmic dust clouds.

coolnatural5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2B0C41#4E1F6B#7C459A#AD74BF#D3A7D6

Palette guide

How to use Cosmic Dust Shimmer

Overview

The Cosmic Dust Shimmer palette offers a mystical journey through purples and lavenders, mirroring shimmering cosmic dust clouds. With a range from the profound #2B0C41 to the delicate #D3A7D6, this palette is ideal for designers creating ethereal and sophisticated experiences. It's particularly well-suited for fantasy-themed interfaces, luxury branding, or digital art that seeks to evoke wonder and depth. Developers can leverage these versatile hex codes, such as the rich #7C459A, to build visually captivating applications and websites, ensuring a consistent and enchanting aesthetic that resonates with users seeking a touch of the extraordinary.

Best used for

Fantasy game UI/UX
Luxury brand aesthetics
Mystical digital illustrations
Ethereal website backgrounds
Creative art installations
High-end product showcases

Suggested color roles

primary

#4E1F6B - A rich, foundational purple perfect for main content areas, headers, or primary branding elements.

secondary

#7C459A - A vibrant mid-tone purple, excellent for secondary information, interactive components, or data visualization.

accent

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

background

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

text

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

Accessibility notes

Ensure sufficient contrast for text using #AD74BF against #7C459A, especially for smaller font sizes.
Always use #D3A7D6 or white for body text on #2B0C41 and #4E1F6B to meet WCAG AA standards.
Be cautious with contrast when layering #AD74BF over #7C459A for crucial UI elements.
Test interactive elements for adequate contrast to ensure usability for users with visual impairments.

Recommended combinations

Deep Nebula

Ideal for creating layered backgrounds that convey depth and mystery in digital environments.

#2B0C41 · #4E1F6B · #7C459A

Shimmering Highlight

Perfect for drawing attention to key features, interactive elements, or glowing accents.

#4E1F6B · #AD74BF · #D3A7D6

Ethereal Overlay

Excellent for overlay effects, subtle gradients, or separating content blocks with a soft, cosmic feel.

#2B0C41 · #7C459A · #D3A7D6

CSS variables

:root {
  --cosmic-dust-shimmer-2-1: #2B0C41;
  --cosmic-dust-shimmer-2-2: #4E1F6B;
  --cosmic-dust-shimmer-2-3: #7C459A;
  --cosmic-dust-shimmer-2-4: #AD74BF;
  --cosmic-dust-shimmer-2-5: #D3A7D6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-dust-shimmer-2": {
        1: "#2B0C41",
        2: "#4E1F6B",
        3: "#7C459A",
        4: "#AD74BF",
        5: "#D3A7D6",
      }
    }
  }
}

Hex values

Color 1#2B0C41

Color 2#4E1F6B

Color 3#7C459A

Color 4#AD74BF

Color 5#D3A7D6

Accessibility

Contrast checker

1.4:1Fail

2.6:1Fail

4.9:1AA

8.3:1AAA

1.4:1Fail

1.8:1Fail

3.5:1AA18

5.9:1AA

2.6:1Fail

1.8:1Fail

1.9:1Fail

3.2:1AA18

4.9:1AA

3.5:1AA18

1.9:1Fail

1.7:1Fail

8.3:1AAA

5.9:1AA

3.2:1AA18

1.7:1Fail

Similar palettes

More like Cosmic Dust Shimmer

View all cool

Arctic Aurora Glow

Celestial Ocean Mirror

Deep Mossy Glen

Emerald Coast Dive

Enchanted Forest Bloom

Lapis Tidepool