Back to palettes

Palette

Cosmic Dust Cloud

A celestial journey from deep violet to ethereal pink and white, reflecting distant nebulae.

vibrantelegant5 colors
More vibrant 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

#3F2E5E#6C4B98#A77CCF#F0C5DF#FDF2FF

Palette guide

How to use Cosmic Dust Cloud

Overview

The Cosmic Dust Cloud palette takes designers on a celestial journey from deep violet to ethereal pink and white, reflecting distant nebulae. Featuring shades from the profound #3F2E5E to the luminous #FDF2FF, this collection offers a vibrant yet elegant aesthetic. Designers can leverage the strong contrast between deep and light tones 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 #3F2E5E as a profound primary, ideal for main backgrounds, commanding headers, or foundational brand elements.

secondary

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

accent

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

background

The deep #3F2E5E provides an immersive dark canvas. Alternatively, #FDF2FF can serve as a delicate, ethereal background.

text

White or a very light gray provides excellent contrast on #3F2E5E, #6C4B98, and #A77CCF. Use #3F2E5E for text on #FDF2FF.

Accessibility notes

  • Ensure white text on #3F2E5E, #6C4B98, and #A77CCF meets WCAG AA contrast standards for readability.
  • Avoid pairing #F0C5DF and #FDF2FF for small text due to their close values and potential low contrast; reserve for larger graphics.
  • The lighter shade #FDF2FF works well for subtle glow effects or as a background for darker text.
  • For body text on #FDF2FF, consider using #3F2E5E or #6C4B98 for better legibility than a standard black.

Recommended combinations

Celestial Journey

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

#3F2E5E · #6C4B98 · #FDF2FF

Nebula Transition

Create smooth gradients or layered effects in UI design, mimicking the atmospheric transition of distant nebulae.

#6C4B98 · #A77CCF · #F0C5DF

Ethereal Contrast

Use #FDF2FF as a light background, #3F2E5E for primary text, and #A77CCF for secondary information or interactive elements.

#FDF2FF · #3F2E5E · #A77CCF

CSS variables

:root {
  --cosmic-dust-cloud-3-1: #3F2E5E;
  --cosmic-dust-cloud-3-2: #6C4B98;
  --cosmic-dust-cloud-3-3: #A77CCF;
  --cosmic-dust-cloud-3-4: #F0C5DF;
  --cosmic-dust-cloud-3-5: #FDF2FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-dust-cloud-3": {
        1: "#3F2E5E",
        2: "#6C4B98",
        3: "#A77CCF",
        4: "#F0C5DF",
        5: "#FDF2FF",
      }
    }
  }
}

Related searches

deep violet pastel paletteethereal space design colorsdreamy nebula schemevibrant purple pink UI colorselegant dark mode branding

Palette colors

Hex values

Color 1#3F2E5E
·
Color 2#6C4B98
·
Color 3#A77CCF
·
Color 4#F0C5DF
·
Color 5#FDF2FF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
3.6:1AA18
7.8:1AAA
11:1AAA
2
1.8:1Fail
2.1:1Fail
4.4:1AA18
6.2:1AA
3
3.6:1AA18
2.1:1Fail
2.1:1Fail
3:1AA18
4
7.8:1AAA
4.4:1AA18
2.1:1Fail
1.4:1Fail
5
11:1AAA
6.2:1AA
3:1AA18
1.4:1Fail

Similar palettes

More like Cosmic Dust Cloud

View all vibrant
Celestial Bloom Dust
Cosmic Dust Swirl
Cosmic Cloud Bloom
Cosmic Iridescent Shine
Cosmic Nebula Hues
Nebula Veil Glimmer