Back to palettes

Palette

Stardust Abyss

Profound blues that merge the vastness of the deep ocean with the endless, star-dusted cosmic expanse.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0F213A#2B477D#5B8BCB#1C3660#4B7BAB

Palette guide

How to use Stardust Abyss

Overview

The 'Stardust Abyss' palette plunges into profound depths, blending the vastness of the ocean with the cosmic expanse. This collection of deep blues, featuring #0F213A (Midnight Blue), #2B477D (Steel Blue), #5B8BCB (Sky Blue), #1C3660 (Dark Cerulean), and #4B7BAB (Slate Blue), offers a sophisticated and mysterious aesthetic. Designers and developers can leverage these hues to create immersive experiences, from digital interfaces to brand identities, that evoke a sense of calm, professionalism, and wonder. It's particularly effective for projects requiring a blend of corporate elegance and artistic depth, making a strong, tranquil statement.

Best used for

  • Corporate websites with a serious yet modern feel
  • Oceanographic or space exploration themed projects
  • Financial or tech industry branding
  • Deep sea or cosmic digital art
  • Masculine product packaging and design
  • Analytics dashboards and data visualization

Suggested color roles

primary

Use #0F213A as the dominant background color to establish a deep, professional foundation.

secondary

Steel Blue (#2B477D) or Dark Cerulean (#1C3660) provide strong secondary colors for panels or sections.

accent

Sky Blue (#5B8BCB) serves as an effective accent for calls-to-action or key data points, providing contrast and clarity.

background

Midnight Blue (#0F213A) creates an immersive dark canvas, while lighter blues can be used for subtle background variations.

text

For dark backgrounds, use white or a very light gray. For lighter blue elements, a deep blue like #0F213A provides excellent contrast for text.

Accessibility notes

  • Ensure high contrast for text, especially when using lighter blues like #5B8BCB against a dark background.
  • Avoid pairing #2B477D and #1C3660 as text and background; their similar luminosity may fail contrast checks.
  • White text on #0F213A or #1C3660 offers excellent readability and meets accessibility standards.
  • When using #5B8BCB for interactive elements, confirm its contrast with surrounding colors meets WCAG guidelines.

Recommended combinations

Deep Ocean

Creates a gradient effect from deep to bright, ideal for headers, hero sections, or data visualizations.

#0F213A · #2B477D · #5B8BCB

Cosmic Depth

Excellent for a professional yet dynamic look, with #1C3660 as a base and #5B8BCB for highlights.

#1C3660 · #4B7BAB · #5B8BCB

Abyss Contrast

A strong combination for dark mode interfaces, using the lightest blue for critical information.

#0F213A · #4B7BAB · #5B8BCB

CSS variables

:root {
  --stardust-abyss-1: #0F213A;
  --stardust-abyss-2: #2B477D;
  --stardust-abyss-3: #5B8BCB;
  --stardust-abyss-4: #1C3660;
  --stardust-abyss-5: #4B7BAB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "stardust-abyss": {
        1: "#0F213A",
        2: "#2B477D",
        3: "#5B8BCB",
        4: "#1C3660",
        5: "#4B7BAB",
      }
    }
  }
}

Related searches

deep blue color palettespace and ocean colorsmystical blue schemedark professional bluecorporate blue palette

Palette colors

Hex values

Color 1#0F213A
·
Color 2#2B477D
·
Color 3#5B8BCB
·
Color 4#1C3660
·
Color 5#4B7BAB
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
4.6:1AA
1.3:1Fail
3.6:1AA18
2
1.8:1Fail
2.6:1Fail
1.3:1Fail
2.1:1Fail
3
4.6:1AA
2.6:1Fail
3.4:1AA18
1.3:1Fail
4
1.3:1Fail
1.3:1Fail
3.4:1AA18
2.7:1Fail
5
3.6:1AA18
2.1:1Fail
1.3:1Fail
2.7:1Fail

Similar palettes

More like Stardust Abyss

View all dark
Abyssal Midnight Reef
Abyssal Trench Mystery
Celestial Abyss Gaze
Celestial Glimmer Dust
Celestial Lanterns
Celestial Night Sky