Back to palettes

Palette

Celestial Abyss Gaze

Plunges into the enigmatic depths of interstellar space, where faint starlight illuminates vast, quiet expanses.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Celestial Abyss Gaze 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 Celestial Abyss Gaze.

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

Data visualization

#0A0A1F#1F1F47#3D3D7A#6C6CAD#9C9CDE

Palette guide

How to use Celestial Abyss Gaze

Overview

The "Celestial Abyss Gaze" palette plunges into the enigmatic depths of interstellar space, where faint starlight illuminates vast, quiet expanses. It features a profound dark navy #0A0A1F, a deep space blue #1F1F47, a rich indigo #3D3D7A, a muted lavender blue #6C6CAD, and a soft periwinkle #9C9CDE. This serene yet mysterious combination is perfect for designs that aim for sophistication, tranquility, and a cosmic aesthetic. Designers can leverage these hex codes for science fiction branding, astronomy websites, or calming digital interfaces. Developers will find this palette ideal for applications requiring an immersive, peaceful, and visually captivating user experience.

Best used for

  • Astronomy and space-themed websites
  • Science fiction game interfaces
  • Dark mode application themes
  • Meditation and relaxation apps
  • Luxury tech branding
  • Digital art with cosmic themes

Suggested color roles

primary

#1F1F47 (Deep Space Blue) - A strong, foundational dark blue, excellent for main headings, important interactive elements, or large background sections, providing depth.

secondary

#3D3D7A (Rich Indigo) - A versatile blue that complements the primary, ideal for secondary information, navigation backgrounds, or content panels.

accent

#6C6CAD (Muted Lavender Blue) - A soft, ethereal blue that offers subtle contrast and a touch of otherworldly light, perfect for subtle highlights or interactive states.

background

#0A0A1F (Profound Dark Navy) - A deep, profound navy, providing an excellent dramatic canvas for content, making the lighter blues shimmer like distant stars.

text

Pure white or a very light gray like #F0F0F0 is highly recommended for text against #0A0A1F, #1F1F47, #3D3D7A, and #6C6CAD. On #9C9CDE (Soft Periwinkle), a dark charcoal or black is preferred.

Accessibility notes

  • Use white or very light text on #0A0A1F, #1F1F47, #3D3D7A, and #6C6CAD for optimal contrast.
  • #9C9CDE (Soft Periwinkle) requires dark text (black or charcoal) to meet WCAG AA standards for readability.
  • Avoid using #6C6CAD for small text against very light backgrounds.
  • Ensure sufficient contrast for all text and interactive elements, especially given the dark background emphasis.

Recommended combinations

Cosmic Depth

For creating immersive backgrounds, elegant headings, or sophisticated UI elements that evoke the vastness of space.

#0A0A1F · #1F1F47 · #3D3D7A

Starlight Gaze

Ideal for highlighting key information, interactive elements, or adding a touch of ethereal light to darker compositions.

#6C6CAD · #9C9CDE · #1F1F47

Abyss Gradient

Excellent for showcasing distinct content sections, subtle branding, or creating graphic patterns with a serene, mysterious aesthetic.

#3D3D7A · #0A0A1F · #6C6CAD

CSS variables

:root {
  --celestial-abyss-gaze-1: #0A0A1F;
  --celestial-abyss-gaze-2: #1F1F47;
  --celestial-abyss-gaze-3: #3D3D7A;
  --celestial-abyss-gaze-4: #6C6CAD;
  --celestial-abyss-gaze-5: #9C9CDE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-abyss-gaze": {
        1: "#0A0A1F",
        2: "#1F1F47",
        3: "#3D3D7A",
        4: "#6C6CAD",
        5: "#9C9CDE",
      }
    }
  }
}

Related searches

dark cosmic color palettecelestial blue schemespace themed web designdeep indigo gradientmysterious dark blue colors

Palette colors

Hex values

Color 1#0A0A1F
·
Color 2#1F1F47
·
Color 3#3D3D7A
·
Color 4#6C6CAD
·
Color 5#9C9CDE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
2:1Fail
4.1:1AA18
7.6:1AAA
2
1.3:1Fail
1.6:1Fail
3.3:1AA18
6.1:1AA
3
2:1Fail
1.6:1Fail
2:1Fail
3.8:1AA18
4
4.1:1AA18
3.3:1AA18
2:1Fail
1.9:1Fail
5
7.6:1AAA
6.1:1AA
3.8:1AA18
1.9:1Fail

Similar palettes

More like Celestial Abyss Gaze

View all dark