Back to palettes

Palette

Stage Curtain Noir

Deep, rich tones evoking the luxurious, shadowed elegance of an old opera house's plush velvet curtains.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Stage Curtain Noir 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 Stage Curtain Noir.

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

Data visualization

#1A1A1A#3A1A1A#5A3A3A#7A5A5A#9A7A7A

Palette guide

How to use Stage Curtain Noir

Overview

The Stage Curtain Noir palette offers a luxurious, deeply muted experience, perfect for projects requiring a sophisticated and dramatic atmosphere. Dominated by rich, dark tones, it transitions smoothly from the near-black #1A1A1A to the softer, smoky #9A7A7A. This collection of colors, including the deep crimson-brown #3A1A1A and the elegant #5A3A3A, evokes the plush velvet and shadowed elegance of an old theater. Developers will find these shades excellent for creating dark mode interfaces or high-end branding where depth and subtlety are key. Designers can leverage its inherent moodiness to craft compelling visuals that feel both classic and modern, ensuring a cohesive and distinguished aesthetic.

Best used for

  • Luxury brand identity
  • Dark mode user interfaces
  • High-end editorial design
  • Theater and arts event promotion
  • Sophisticated app themes
  • Mood-driven digital portfolios

Suggested color roles

primary

Use #1A1A1A as the foundational deep background for a truly immersive dark theme, providing a sense of gravitas and luxury.

secondary

Apply #3A1A1A for secondary sections, dividers, or subtle hover states, adding a touch of warm, deep crimson to the overall dark canvas.

accent

Employ #7A5A5A sparingly for interactive elements, subtle highlights, or call-to-action buttons, offering a gentle contrast without breaking the mood.

background

The deepest tone, #1A1A1A, is ideal for primary backgrounds, establishing the sophisticated 'noir' atmosphere across web and mobile applications.

text

For readable body text on dark backgrounds, use #9A7A7A, or consider a pure white or very light grey for headings and crucial information to ensure sufficient contrast.

Accessibility notes

  • Ensure sufficient contrast when pairing lighter palette colors (e.g., #9A7A7A) with darker ones, especially for small text.
  • Avoid using #1A1A1A and #3A1A1A for text/background pairings without careful contrast checks; they are too close in luminance.
  • For interactive elements like buttons, use #7A5A5A against #1A1A1A, but verify readability with standard contrast tools.
  • Consider using a brighter, high-contrast color (e.g., pure white) for essential UI elements or critical alerts if accessibility is paramount.

Recommended combinations

Deep & Dramatic

Ideal for a primary dark mode theme where #1A1A1A is the background, #9A7A7A for text, and #3A1A1A for cards or sections.

#1A1A1A · #9A7A7A · #3A1A1A

Velvet Layers

Excellent for creating layered UI elements, such as nested panels or accordions, offering subtle visual separation within a dark aesthetic.

#3A1A1A · #5A3A3A · #7A5A5A

Accent Focus

Use #1A1A1A as a deep backdrop, #7A5A5A for key interactive elements, and #9A7A7A for headings or important textual content.

#1A1A1A · #7A5A5A · #9A7A7A

CSS variables

:root {
  --stage-curtain-noir-1: #1A1A1A;
  --stage-curtain-noir-2: #3A1A1A;
  --stage-curtain-noir-3: #5A3A3A;
  --stage-curtain-noir-4: #7A5A5A;
  --stage-curtain-noir-5: #9A7A7A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "stage-curtain-noir": {
        1: "#1A1A1A",
        2: "#3A1A1A",
        3: "#5A3A3A",
        4: "#7A5A5A",
        5: "#9A7A7A",
      }
    }
  }
}

Related searches

dark luxury color palettevelvet color schemeelegant noir colorsmoody dark designtheater inspired palette

Palette colors

Hex values

Color 1#1A1A1A
·
Color 2#3A1A1A
·
Color 3#5A3A3A
·
Color 4#7A5A5A
·
Color 5#9A7A7A
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.7:1Fail
2.8:1Fail
4.5:1AA
2
1.1:1Fail
1.6:1Fail
2.6:1Fail
4.1:1AA18
3
1.7:1Fail
1.6:1Fail
1.6:1Fail
2.6:1Fail
4
2.8:1Fail
2.6:1Fail
1.6:1Fail
1.6:1Fail
5
4.5:1AA
4.1:1AA18
2.6:1Fail
1.6:1Fail

Similar palettes

More like Stage Curtain Noir

View all dark