Palette

Celestial Echo Swirl

Mystical blues and purples swirling, a cosmic dance echoing the vastness of the universe.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Celestial Echo Swirl 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 Echo Swirl.

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

Data visualization

#0F0F2D#2B2B4F#4A4A7A#6C6C9F#8E8ECB

Palette guide

How to use Celestial Echo Swirl

Overview

The Celestial Echo Swirl palette features mystical blues and purples swirling, a cosmic dance echoing the vastness of the universe. Ranging from the profound #0F0F2D to the vibrant #8E8ECB, with harmonious intermediate shades like #2B2B4F, #4A4A7A, and #6C6C9F, this collection exudes a dark, mysterious, and abstract aura. It's ideal for designers and developers looking to create immersive, captivating, and sophisticated digital experiences, branding, or interfaces that evoke the vastness and beauty of the cosmos with a touch of abstract wonder.

Best used for

Sci-fi game interfaces and environment art
Abstract art and design portfolios
Luxury tech company branding
Dark mode UI for creative applications
Astronomy visualization tools
High-end event themes

Suggested color roles

primary

#0F0F2D serves as a dominant, deep background color, establishing a mysterious and profound foundation.

secondary

#2B2B4F or #4A4A7A are excellent for secondary sections, navigation, or card backgrounds, adding depth and richness.

accent

#8E8ECB or #6C6C9F provides a luminous highlight for interactive elements, calls to action, or subtle glowing effects.

background

For dark themes, #0F0F2D is the primary background, creating a true dark mode experience.

text

#8E8ECB or #6C6C9F offers excellent readability against the darker shades. A near-white is also suitable.

Accessibility notes

#8E8ECB provides strong contrast for text on #0F0F2D, #2B2B4F, and #4A4A7A, meeting WCAG AA standards.
Be cautious when using #6C6C9F for small text on #8E8ECB; ensure sufficient contrast.
Ensure interactive elements using lighter shades on darker backgrounds have clear focus states.
This palette offers good options for high contrast text pairings, especially with the lightest and darkest shades.

Recommended combinations

Cosmic Depths

Ideal for a sophisticated dark mode interface with clear hierarchy and a vibrant accent.

#0F0F2D · #8E8ECB · #4A4A7A

Abstract Gradient

Perfect for background fills or hero sections, creating a smooth, ethereal transition.

#2B2B4F · #4A4A7A · #6C6C9F

Luminous Swirl

Use #8E8ECB as a light background for specific content blocks, with dark text and a deeper accent.

#8E8ECB · #0F0F2D · #2B2B4F

CSS variables

:root {
  --celestial-echo-swirl-1: #0F0F2D;
  --celestial-echo-swirl-2: #2B2B4F;
  --celestial-echo-swirl-3: #4A4A7A;
  --celestial-echo-swirl-4: #6C6C9F;
  --celestial-echo-swirl-5: #8E8ECB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-echo-swirl": {
        1: "#0F0F2D",
        2: "#2B2B4F",
        3: "#4A4A7A",
        4: "#6C6C9F",
        5: "#8E8ECB",
      }
    }
  }
}

Hex values

Color 1#0F0F2D

Color 2#2B2B4F

Color 3#4A4A7A

Color 4#6C6C9F

Color 5#8E8ECB

Accessibility

Contrast checker

1.4:1Fail

2.3:1Fail

3.8:1AA18

6.1:1AA

1.4:1Fail

1.6:1Fail

2.7:1Fail

4.4:1AA18

2.3:1Fail

1.6:1Fail

1.7:1Fail

2.7:1Fail

3.8:1AA18

2.7:1Fail

1.7:1Fail

1.6:1Fail

6.1:1AA

4.4:1AA18

2.7:1Fail

1.6:1Fail

Similar palettes

More like Celestial Echo Swirl

Celestial Echo Swirl

See it in context.

Ready when you are.

Built with Celestial Echo Swirl.

How to use Celestial Echo Swirl

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Cosmic Depths

Abstract Gradient

Luminous Swirl

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Celestial Echo Swirl