Palette

Nebula Dust Shadow

Deep grays and purplish blacks that reflect the mysterious, shimmering depths of cosmic dust.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Nebula Dust Shadow 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 Nebula Dust Shadow.

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

Data visualization

#0F0F1A#2A2A3A#4E4E6A#7A7A9A#AFAFC0

Palette guide

How to use Nebula Dust Shadow

Overview

The Nebula Dust Shadow palette features deep grays and purplish blacks that reflect the mysterious, shimmering depths of cosmic dust. With shades ranging from the profound #0F0F1A to the slightly lighter #2A2A3A, the balanced #4E4E6A, the subtle #7A7A9A, and the soft #AFAFC0, this collection is perfect for designs that require a sophisticated, dark, and slightly moody aesthetic. Designers can leverage the monochromatic gradient for elegant backgrounds and use the lighter grays for subtle highlights or text. Developers will find this palette excellent for creating minimalist dark mode interfaces, professional websites, or any application that benefits from a clean, understated, and cosmic-inspired look. It’s a truly versatile dark palette.

Best used for

Minimalist dark mode UI
Professional tech company websites
Photography portfolio backgrounds
Abstract art showcases
High-end automotive branding
Science fiction game interfaces

Suggested color roles

primary

Utilize #0F0F1A as the dominant background color to establish a deep, sophisticated foundation.

secondary

Apply #2A2A3A for secondary content areas or large text blocks, offering subtle depth.

accent

Highlight interactive elements or key information with #AFAFC0 for a subtle, elegant contrast.

background

The darkest shade, #0F0F1A, is excellent for an immersive, dark background, allowing content to pop.

text

For optimal readability on darker shades, use white or a very light gray like #AFAFC0.

Accessibility notes

White text on #0F0F1A, #2A2A3A, and #4E4E6A provides excellent contrast and readability.
Ensure sufficient contrast when using #7A7A9A for text on #AFAFC0, as they are relatively close in lightness.
Avoid using #4E4E6A for small text on #2A2A3A without careful contrast verification.
The #AFAFC0 shade is light enough to support dark gray or black text for optimal accessibility if used as a background.

Recommended combinations

Deep Shadow

Creates a seamless dark gradient, ideal for subtle background textures or section dividers.

#0F0F1A · #2A2A3A · #4E4E6A

Cosmic Glow

Provides strong contrast for text or icons against a dark base, perfect for highlights.

#0F0F1A · #7A7A9A · #AFAFC0

Dusty Horizon

Offers a soft, mid-tone progression, suitable for secondary information blocks or subtle UI elements.

#2A2A3A · #4E4E6A · #7A7A9A

CSS variables

:root {
  --nebula-dust-shadow-1: #0F0F1A;
  --nebula-dust-shadow-2: #2A2A3A;
  --nebula-dust-shadow-3: #4E4E6A;
  --nebula-dust-shadow-4: #7A7A9A;
  --nebula-dust-shadow-5: #AFAFC0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "nebula-dust-shadow": {
        1: "#0F0F1A",
        2: "#2A2A3A",
        3: "#4E4E6A",
        4: "#7A7A9A",
        5: "#AFAFC0",
      }
    }
  }
}

Hex values

Color 1#0F0F1A

Color 2#2A2A3A

Color 3#4E4E6A

Color 4#7A7A9A

Color 5#AFAFC0

Accessibility

Contrast checker

1.4:1Fail

2.4:1Fail

4.6:1AA

8.8:1AAA

1.4:1Fail

1.8:1Fail

3.4:1AA18

6.5:1AA

2.4:1Fail

1.8:1Fail

1.9:1Fail

3.7:1AA18

4.6:1AA

3.4:1AA18

1.9:1Fail

8.8:1AAA

6.5:1AA

3.7:1AA18

1.9:1Fail

Similar palettes

More like Nebula Dust Shadow

Nebula Dust Shadow

See it in context.

Ready when you are.

Built with Nebula Dust Shadow.

How to use Nebula Dust Shadow

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Deep Shadow

Cosmic Glow

Dusty Horizon

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Nebula Dust Shadow