Back to palettes

Palette

Cosmic Drift

A mysterious journey through the cool, expansive beauty of the night sky and distant galaxies.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cosmic Drift 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 Cosmic Drift.

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

Data visualization

#1F2940#6A5ACD#3D687A#C0C0C0#4B0082

Palette guide

How to use Cosmic Drift

Overview

The Cosmic Drift palette offers a mysterious journey through the cool, expansive beauty of the night sky and distant galaxies. Featuring shades like the deep #1F2940, the elegant #6A5ACD, and the neutral #C0C0C0, this collection provides a dark yet sophisticated aesthetic. Designers can leverage the cool blues and purples with a touch of silver to create captivating visual hierarchies. Developers will find these hex codes ideal for crafting immersive digital experiences, from sophisticated dark mode interfaces to elegant website themes, ensuring a visually rich and engaging user journey that conveys depth and cosmic wonder across various digital platforms.

Best used for

  • Luxury dark mode UI/UX design
  • Mystical or contemplative app interfaces
  • High-end event or brand identity
  • Digital art with deep space themes
  • E-commerce for unique artisanal products
  • Fashion editorial layouts with an elegant, dark edge

Suggested color roles

primary

Designate #1F2940 as a profound primary, ideal for main backgrounds, commanding headers, or foundational brand elements.

secondary

Utilize #6A5ACD as a rich secondary, excellent for subheadings, navigation, or larger background sections to add depth.

accent

Apply #C0C0C0 as a subtle accent, perfect for interactive elements, icons, or highlights that need to draw attention gently.

background

The deep #1F2940 provides an immersive dark canvas. Alternatively, #C0C0C0 can serve as a delicate, ethereal background.

text

White or a very light gray provides excellent contrast on #1F2940, #6A5ACD, and #3D687A. Use #1F2940 for text on #C0C0C0.

Accessibility notes

  • Ensure white text on #1F2940, #6A5ACD, and #3D687A meets WCAG AA contrast standards for readability.
  • Avoid pairing #C0C0C0 with #6A5ACD for small text due to their close values and potential low contrast; reserve for larger graphics.
  • The silver #C0C0C0 provides excellent contrast against the darker shades for calls-to-action.
  • For body text, ensure a strong contrast against any background, defaulting to white on darks or black on very light backgrounds (if applicable).

Recommended combinations

Galaxy Depths

Combine the deepest shades for a profound background with a vibrant purple and silver for striking text or key UI elements.

#1F2940 · #6A5ACD · #C0C0C0

Cosmic Flow

Create smooth gradients or layered effects in UI design, mimicking the atmospheric transition of distant galaxies.

#6A5ACD · #3D687A · #4B0082

Elegant Contrast

Use #C0C0C0 as a light background, #1F2940 for primary text, and #6A5ACD for secondary information or interactive elements.

#C0C0C0 · #1F2940 · #6A5ACD

CSS variables

:root {
  --cosmic-drift-1: #1F2940;
  --cosmic-drift-2: #6A5ACD;
  --cosmic-drift-3: #3D687A;
  --cosmic-drift-4: #C0C0C0;
  --cosmic-drift-5: #4B0082;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-drift": {
        1: "#1F2940",
        2: "#6A5ACD",
        3: "#3D687A",
        4: "#C0C0C0",
        5: "#4B0082",
      }
    }
  }
}

Related searches

dark lavender cosmic palettemysterious galaxy design colorscool night sky schemeelegant dark UI colorssophisticated space branding

Palette colors

Hex values

Color 1#1F2940
·
Color 2#6A5ACD
·
Color 3#3D687A
·
Color 4#C0C0C0
·
Color 5#4B0082
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.7:1Fail
2.4:1Fail
8:1AAA
1.1:1Fail
2
2.7:1Fail
1.1:1Fail
2.9:1Fail
2.4:1Fail
3
2.4:1Fail
1.1:1Fail
3.3:1AA18
2.1:1Fail
4
8:1AAA
2.9:1Fail
3.3:1AA18
7.1:1AAA
5
1.1:1Fail
2.4:1Fail
2.1:1Fail
7.1:1AAA

Similar palettes

More like Cosmic Drift

View all dark
Cathedral Stained Glass
Celestial Starry Veil
Deep Space Nebula
Gothic Rose Window
Gothic Velvet Cloak
Midnight Bloom Velvet