Palette

Glimmering Star Dust

Captures the ethereal beauty of distant stardust and the faint glow of nebulae in the night sky.

coolminimal5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Glimmering Star 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 Glimmering Star Dust.

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

Data visualization

#3A3A5E#5C5C8C#8E8EC7#BCCBD6#E5EBF2

Palette guide

How to use Glimmering Star Dust

Overview

The Glimmering Star Dust palette presents an elegant progression of cool, celestial tones, perfect for designs requiring a sophisticated and ethereal touch. Ranging from the deep, mysterious indigo of #3A3A5E to the airy, almost white #E5EBF2, this collection evokes the vastness and subtle glow of the night sky. Designers will find these colors ideal for creating minimalist yet impactful experiences, lending an air of refinement. The mid-tones like #5C5C8C and #8E8EC7 provide excellent versatility for gradients or layered interfaces. Developers can use this palette to build user interfaces that feel premium, calming, and visually expansive, suitable for tech, luxury, or artistic applications.

Best used for

Luxury brand websites
Space exploration themed applications
High-end tech product interfaces
Elegant editorial designs
Minimalist digital art
Corporate branding with a sophisticated edge

Suggested color roles

primary

#3A3A5E - A deep, rich indigo, excellent for bold headers, footers, or background sections that require depth and sophistication.

secondary

#5C5C8C - A medium-dark periwinkle, perfect for content containers, navigation bars, or secondary information blocks.

accent

#8E8EC7 - A lighter, serene lavender-blue, ideal for calls-to-action, interactive elements, or graphic highlights that need to stand out gently.

background

#E5EBF2 - A very light, cool off-white, providing a clean, expansive, and luminous canvas for all content.

text

#3A3A5E - The darkest shade, ideal for primary body text against lighter backgrounds like #E5EBF2 or #BCCBD6 for maximum readability and a cohesive look.

Accessibility notes

Ensure sufficient contrast when pairing #8E8EC7 or #BCCBD6 with very light text; dark text is generally preferred.
The darkest color, #3A3A5E, offers excellent contrast for white or light-colored text, promoting readability.
Avoid using #E5EBF2 for text unless it's very large and against a significantly darker background.
Always check contrast ratios for text and interactive elements, especially when using mid-range blues, to meet WCAG standards.

Recommended combinations

Celestial Interface

#3A3A5E as a dramatic background, #E5EBF2 for primary content, and #8E8EC7 for highlights.

#3A3A5E · #E5EBF2 · #8E8EC7

Gradient Flow

Create smooth, deep gradients for hero sections or background textures, evoking a cosmic feel.

#3A3A5E · #5C5C8C · #8E8EC7

Clean Data Display

#E5EBF2 as the main background, #BCCBD6 for data tables or charts, and #5C5C8C for key metrics.

#E5EBF2 · #BCCBD6 · #5C5C8C

CSS variables

:root {
  --glimmering-star-dust-1: #3A3A5E;
  --glimmering-star-dust-2: #5C5C8C;
  --glimmering-star-dust-3: #8E8EC7;
  --glimmering-star-dust-4: #BCCBD6;
  --glimmering-star-dust-5: #E5EBF2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glimmering-star-dust": {
        1: "#3A3A5E",
        2: "#5C5C8C",
        3: "#8E8EC7",
        4: "#BCCBD6",
        5: "#E5EBF2",
      }
    }
  }
}

Hex values

Color 1#3A3A5E

Color 2#5C5C8C

Color 3#8E8EC7

Color 4#BCCBD6

Color 5#E5EBF2

Accessibility

Contrast checker

1.7:1Fail

3.5:1AA18

6.5:1AA

9:1AAA

1.7:1Fail

2:1Fail

3.8:1AA18

5.2:1AA

3.5:1AA18

2:1Fail

1.8:1Fail

2.6:1Fail

6.5:1AA

3.8:1AA18

1.8:1Fail

1.4:1Fail

9:1AAA

5.2:1AA

2.6:1Fail

1.4:1Fail

Similar palettes

More like Glimmering Star Dust

Arctic Glacier Sparkle