Palette

Stardust Cloudscape

A majestic array of cosmic dust and gas, swirling into new, unknown forms in deep space.

darkelegant5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Stardust Cloudscape 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 Stardust Cloudscape.

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

Data visualization

#3F204C#5C2B68#2A0E38#7C6381#967BB6

Palette guide

How to use Stardust Cloudscape

Overview

The 'Stardust Cloudscape' palette offers a majestic array of cosmic purples and grays, perfect for designs that aim for an elegant, mysterious, and deep space aesthetic. It features a range from the profound #2A0E38 (Dark Violet) and #3F204C (Deep Plum) to the vibrant #5C2B68 (Royal Purple), softened by the sophisticated #7C6381 (Muted Amethyst) and the luminous #967BB6 (Lavender Gray). This collection is ideal for designers and developers looking to create immersive experiences in UI, branding, or digital art that evokes the swirling beauty of a distant nebula, providing a sense of wonder and refined elegance.

Best used for

Cosmic-themed websites and applications
Luxury brand identity for high-tech products
Elegant event branding and invitations
Abstract digital art and illustrations
Fantasy game interfaces or concept art
Sophisticated fashion or beauty e-commerce

Suggested color roles

primary

Use #2A0E38 or #3F204C as the dominant background color to create a deep, immersive space.

secondary

Royal Purple (#5C2B68) can define key content areas or prominent UI elements, adding vibrancy.

accent

Lavender Gray (#967BB6) serves as a luminous accent, perfect for calls-to-action or subtle interactive elements.

background

A deep tone like #2A0E38 or #3F204C provides a rich canvas, enhancing the other purples.

text

For dark backgrounds, white or #967BB6 provides excellent readability. For lighter elements, #2A0E38 works well for text.

Accessibility notes

Ensure strong contrast for text against darker purples; #967BB6 or white text is recommended for readability.
Avoid using #7C6381 as text on #5C2B68 background due to potential insufficient contrast.
The lighter #967BB6 offers good contrast for dark text, but always verify with accessibility tools.
Use #5C2B68 for larger headings or graphical elements rather than small body text on dark backgrounds.

Recommended combinations

Nebula Glow

Creates a dramatic background with a vibrant mid-tone and a soft, ethereal highlight.

#2A0E38 · #5C2B68 · #967BB6

Cosmic Depth

Ideal for a sophisticated and layered look, blending deep and muted purples with a light accent.

#3F204C · #7C6381 · #967BB6

Twilight Echo

Excellent for creating a mysterious atmosphere, using the muted amethyst for subheadings or subtle details.

#2A0E38 · #3F204C · #7C6381

CSS variables

:root {
  --stardust-cloudscape-1: #3F204C;
  --stardust-cloudscape-2: #5C2B68;
  --stardust-cloudscape-3: #2A0E38;
  --stardust-cloudscape-4: #7C6381;
  --stardust-cloudscape-5: #967BB6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "stardust-cloudscape": {
        1: "#3F204C",
        2: "#5C2B68",
        3: "#2A0E38",
        4: "#7C6381",
        5: "#967BB6",
      }
    }
  }
}

Hex values

Color 1#3F204C

Color 2#5C2B68

Color 3#2A0E38

Color 4#7C6381

Color 5#967BB6

Accessibility

Contrast checker

1.3:1Fail

1.2:1Fail

2.6:1Fail

3.8:1AA18

1.3:1Fail

1.6:1Fail

2:1Fail

2.9:1Fail

1.2:1Fail

1.6:1Fail

3.2:1AA18

4.8:1AA

2.6:1Fail

2:1Fail

3.2:1AA18

1.5:1Fail

3.8:1AA18

2.9:1Fail

4.8:1AA

1.5:1Fail

Similar palettes

More like Stardust Cloudscape

View all dark

Celestial Dust Glimmer

Celestial Dust Trail

Celestial Stardust Trails

Celestial Whisper Nebula

Cosmic Drama Scene

Cosmic Jellyfish Bloom