Back to palettes

Palette

Cosmic Drama Scene

Inspired by the vast, mysterious backdrop of the night sky, reminiscent of a theatrical stage.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1A0F2E#3A0D4A#6A1A4E#8F6B01#0F0F0F

Palette guide

How to use Cosmic Drama Scene

Overview

The Cosmic Drama Scene palette draws inspiration from the vast, mysterious backdrop of the night sky, reminiscent of a theatrical stage. Featuring deep, dramatic tones like #1A0F2E, the rich #3A0D4A, and a surprising #8F6B01, this collection offers designers an elegant yet intense choice. The contrasting dark purples and a bold golden accent create a compelling visual narrative, perfect for conveying sophistication and allure. Developers can leverage these hex codes to craft immersive digital experiences, from luxurious dark mode interfaces to captivating website themes, ensuring a visually rich and engaging user journey that evokes drama and elegance across various digital platforms.

Best used for

  • Luxury event or theater branding
  • High-end fashion or beauty websites
  • Dark mode UI/UX for sophisticated apps
  • Digital art with dramatic or theatrical themes
  • E-commerce for unique, curated products
  • Film or documentary title sequences

Suggested color roles

primary

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

secondary

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

accent

Apply #8F6B01 as a striking accent, perfect for interactive elements, icons, or highlights that need to draw attention.

background

The deep #0F0F0F or #1A0F2E provides an immersive dark canvas, setting a dramatic stage.

text

White or a very light gray provides excellent contrast on #1A0F2E, #3A0D4A, and #6A1A4E. Use #0F0F0F for text on #8F6B01.

Accessibility notes

  • Ensure white text on #1A0F2E, #3A0D4A, and #6A1A4E meets WCAG AA contrast standards for readability.
  • The vibrant #8F6B01 provides excellent contrast against the darker shades for calls-to-action; ensure its text is dark.
  • Avoid pairing #6A1A4E with #8F6B01 for small text unless contrast is confirmed; reserve for larger graphics.
  • For body text on #0F0F0F, white or a very light gray is essential for legibility.

Recommended combinations

Dramatic Stage

Combine the deepest black with a dark purple and a golden accent for a dramatic header or a striking product display.

#0F0F0F · #1A0F2E · #8F6B01

Cosmic Spotlight

Create layered effects or subtle gradients with the purples, using the gold for key highlights or interactive elements.

#3A0D4A · #6A1A4E · #8F6B01

Elegant Contrast

Use #1A0F2E as a dark background, #8F6B01 for primary highlights, and #3A0D4A for secondary information or subtle accents.

#1A0F2E · #8F6B01 · #3A0D4A

CSS variables

:root {
  --cosmic-drama-scene-1: #1A0F2E;
  --cosmic-drama-scene-2: #3A0D4A;
  --cosmic-drama-scene-3: #6A1A4E;
  --cosmic-drama-scene-4: #8F6B01;
  --cosmic-drama-scene-5: #0F0F0F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-drama-scene": {
        1: "#1A0F2E",
        2: "#3A0D4A",
        3: "#6A1A4E",
        4: "#8F6B01",
        5: "#0F0F0F",
      }
    }
  }
}

Related searches

dark theatrical color paletteelegant night sky designdramatic cosmic schemeluxury dark purple gold UIsophisticated event branding

Palette colors

Hex values

Color 1#1A0F2E
·
Color 2#3A0D4A
·
Color 3#6A1A4E
·
Color 4#8F6B01
·
Color 5#0F0F0F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.6:1Fail
3.7:1AA18
1.1:1Fail
2
1.2:1Fail
1.4:1Fail
3.2:1AA18
1.2:1Fail
3
1.6:1Fail
1.4:1Fail
2.3:1Fail
1.7:1Fail
4
3.7:1AA18
3.2:1AA18
2.3:1Fail
3.9:1AA18
5
1.1:1Fail
1.2:1Fail
1.7:1Fail
3.9:1AA18

Similar palettes

More like Cosmic Drama Scene

View all dark
Midnight Velvet Starry
Deep Velvet Night
Gala Night Velvet
Galactic Empress Gown
Gothic Night Bloom
Midnight Jazz Club