Palette

Gothic Rose Window

Inspired by the rich, deep purples and blues of a gothic cathedral's stained glass rose window.

darkelegant5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gothic Rose Window 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 Gothic Rose Window.

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

Data visualization

#1C0C2F#3C1F5C#6A3A8E#9F62BD#D49BEA

Palette guide

How to use Gothic Rose Window

Overview

The Gothic Rose Window palette is inspired by the rich, deep purples and blues of a gothic cathedral's stained glass. This elegant gradient ranges from the profound #1C0C2F to the luminous #D49BEA, with harmonious mid-tones like #3C1F5C, #6A3A8E, and #9F62BD. It offers a mysterious yet sophisticated aesthetic, perfect for designs that require depth, luxury, and a touch of the ethereal. Designers can use this palette to create immersive experiences, sophisticated branding, and captivating digital interfaces that evoke an ancient, regal charm.

Best used for

Luxury fashion and beauty brands
Mystical or spiritual service branding
High-end event design and invitations
Fantasy-themed digital art and games
Elegant website and app user interfaces
Creative photography portfolios

Suggested color roles

primary

Use #1C0C2F as the deepest, most foundational color for backgrounds or main structural elements, providing profound depth.

secondary

Employ #3C1F5C or #6A3A8E for supportive sections, subheadings, or layered elements, building on the purple theme.

accent

Reserve #D49BEA for luminous highlights, delicate details, or as a vibrant accent color to draw the eye.

background

Choose #1C0C2F for a truly immersive, dark background, or #D49BEA for a light, ethereal base with dark text.

text

Utilize #D49BEA for primary text on dark backgrounds like #1C0C2F or #3C1F5C to ensure readability and a sophisticated glow.

Accessibility notes

Ensure strong contrast between #D49BEA text and darker purples like #1C0C2F or #3C1F5C for optimal readability.
Avoid using mid-tone purples like #6A3A8E or #9F62BD for small body text without sufficient contrast.
Test for color blindness, particularly with the progression of purples to ensure distinctness where necessary.
For lighter backgrounds (e.g., near-white), use a very dark purple like #1C0C2F for text to maintain legibility.

Recommended combinations

Deep Gradation

Creates a smooth, rich purple transition for backgrounds or layered graphic elements.

#1C0C2F · #3C1F5C · #6A3A8E

Luminous Contrast

Pairs the deepest purple with the lightest accent and a vibrant mid-tone for striking visuals.

#1C0C2F · #D49BEA · #9F62BD

Rich Harmony

A balanced blend of purples for sophisticated branding and user interface elements.

#3C1F5C · #6A3A8E · #D49BEA

CSS variables

:root {
  --gothic-rose-window-1: #1C0C2F;
  --gothic-rose-window-2: #3C1F5C;
  --gothic-rose-window-3: #6A3A8E;
  --gothic-rose-window-4: #9F62BD;
  --gothic-rose-window-5: #D49BEA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gothic-rose-window": {
        1: "#1C0C2F",
        2: "#3C1F5C",
        3: "#6A3A8E",
        4: "#9F62BD",
        5: "#D49BEA",
      }
    }
  }
}

Hex values

Color 1#1C0C2F

Color 2#3C1F5C

Color 3#6A3A8E

Color 4#9F62BD

Color 5#D49BEA

Accessibility

Contrast checker

1.3:1Fail

2.3:1Fail

4.3:1AA18

8.5:1AAA

1.3:1Fail

1.7:1Fail

3.2:1AA18

6.3:1AA

2.3:1Fail

1.7:1Fail

1.9:1Fail

3.7:1AA18

4.3:1AA18

3.2:1AA18

1.9:1Fail

2:1Fail

8.5:1AAA

6.3:1AA

3.7:1AA18

2:1Fail

Similar palettes

More like Gothic Rose Window

View all dark

Cathedral Stained Glass

Gothic Velvet Cloak

Midnight Rose Velvet

Nocturne Bloom Velvet

Twilight Orchid Hue

Amethyst Veil Mystique