Back to palettes

Palette

Nebula Depths

Explores the profound depths of space with dark, ethereal hues found within a vibrant, distant nebula.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1A237E#4A148C#880E4F#2C3A5A#0D0F1C

Palette guide

How to use Nebula Depths

Overview

The Nebula Depths palette explores the profound depths of space with dark, ethereal hues. This collection features the deep indigo #1A237E, the rich violet #4A148C, the intense magenta #880E4F, a cool dark gray #2C3A5A, and the almost black #0D0F1C. It's ideal for projects requiring a mysterious, sophisticated, and deeply immersive atmosphere. Designers can leverage the darker tones for foundational elements and use the richer purples and magenta for striking accents. Developers will find this palette excellent for creating elegant dark mode interfaces, cosmic-themed applications, or any design that benefits from a sense of gravity and understated luxury. It truly evokes the infinite mystery of space.

Best used for

  • Luxury product websites
  • Cinematic title sequences
  • Dark mode operating systems
  • High-end fashion branding
  • Abstract digital art
  • Science fiction game interfaces

Suggested color roles

primary

Use #0D0F1C as the dominant background color to establish a profound, almost black canvas.

secondary

Apply #1A237E for secondary content areas or large text blocks, providing subtle depth.

accent

Highlight key interactive elements or calls to action with #880E4F for a powerful, eye-catching pop.

background

The deepest shade, #0D0F1C, is perfect for an immersive, dark background, enhancing content with contrast.

text

For optimal readability on these dark shades, use white or a very light gray text.

Accessibility notes

  • White text on #0D0F1C, #1A237E, and #4A148C provides excellent contrast and readability.
  • Avoid using #2C3A5A for text on #1A237E; the contrast ratio may be insufficient.
  • Ensure sufficient contrast for any interactive elements using #880E4F, especially against darker backgrounds.
  • Always test text contrast ratios, particularly for smaller body text, to meet WCAG standards.

Recommended combinations

Deep Cosmos

Creates a layered, dark, and mysterious effect, suitable for immersive digital experiences.

#0D0F1C · #1A237E · #4A148C

Nebula Core

Highlights vibrant core elements against a darker base, ideal for impactful calls to action.

#1A237E · #4A148C · #880E4F

Shadowed Violet

Offers a sophisticated, muted palette, perfect for elegant typography or subtle branding.

#0D0F1C · #2C3A5A · #4A148C

CSS variables

:root {
  --nebula-depths-1: #1A237E;
  --nebula-depths-2: #4A148C;
  --nebula-depths-3: #880E4F;
  --nebula-depths-4: #2C3A5A;
  --nebula-depths-5: #0D0F1C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "nebula-depths": {
        1: "#1A237E",
        2: "#4A148C",
        3: "#880E4F",
        4: "#2C3A5A",
        5: "#0D0F1C",
      }
    }
  }
}

Related searches

deep space color palettedark mysterious themecosmic violet colorsluxury dark mode UIelegant deep purple

Palette colors

Hex values

Color 1#1A237E
·
Color 2#4A148C
·
Color 3#880E4F
·
Color 4#2C3A5A
·
Color 5#0D0F1C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.4:1Fail
1.2:1Fail
1.4:1Fail
2
1.1:1Fail
1.3:1Fail
1.1:1Fail
1.6:1Fail
3
1.4:1Fail
1.3:1Fail
1.2:1Fail
2:1Fail
4
1.2:1Fail
1.1:1Fail
1.2:1Fail
1.7:1Fail
5
1.4:1Fail
1.6:1Fail
2:1Fail
1.7:1Fail

Similar palettes

More like Nebula Depths

View all dark
Cosmic Deep Slumber
Dark Galaxy Nebula
Galactic Night Voyage
Galactic Void Shimmer
Starlight Abyss Ink
Starlight Nebula Gaze