Back to palettes

Palette

Gothic Cathedral Stain

Rich, deep hues inspired by the solemn, profound beauty of ancient stained glass windows.

DarkElegant5 colors
More Dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gothic Cathedral Stain 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 Cathedral Stain.

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

Data visualization

#4B0082#8B0000#2F4F4F#800000#000000

Palette guide

How to use Gothic Cathedral Stain

Overview

The "Gothic Cathedral Stain" palette captures the solemn and profound beauty of ancient stained glass, offering a selection of rich, deep hues. It features a majestic Dark Violet (#4B0082), a powerful Dark Red (#8B0000), a serene Dark Slate Gray (#2F4F4F), a robust Maroon (#800000), and a grounding Black (#000000). This collection is perfect for designers and developers seeking to evoke drama, elegance, and historical grandeur. These colors can build immersive digital experiences, refined branding, or artistic compositions that resonate with a deep, sophisticated mood, reflecting the timeless artistry of medieval architecture.

Best used for

  • Luxury brand websites and high-end portfolios
  • Historical game design and cinematic interfaces
  • Formal event branding and invitations
  • Art gallery digital presentations
  • Theatrical production visual identity
  • Fashion and jewelry e-commerce with a dramatic aesthetic

Suggested color roles

primary

#4B0082 (Dark Violet) - A deep, regal primary, ideal for hero sections, main navigation, or elements demanding immediate attention and elegance.

secondary

#2F4F4F (Dark Slate Gray) - Provides a cool, stable counterpoint, excellent for background panels, footers, or secondary content blocks.

accent

#8B0000 (Dark Red) - A powerful and passionate accent, perfect for call-to-action buttons, alerts, or highlighting crucial information with intensity.

background

#000000 (Black) - The ultimate grounding background, providing maximum contrast for the rich jewel tones to truly stand out.

text

#800000 (Maroon) - A rich, legible color for headlines on a black background. For body text on dark backgrounds, white or a very light gray is highly recommended for readability.

Accessibility notes

  • For body text, always pair white or a very light gray with #000000, #4B0082, or #2F4F4F to ensure optimal readability.
  • When using #8B0000 or #800000 for text, particularly against #2F4F4F, verify contrast; white text is generally a safer choice.
  • Ensure sufficient contrast between #4B0082 and #8B0000 if used adjacently for distinct interactive elements.
  • Small text should strictly adhere to high contrast pairings, typically white on the darkest available colors.

Recommended combinations

Regal Depth

Creates a grand, imposing feel for headers, main sections, or decorative borders, with #000000 as a deep backdrop.

#000000 · #4B0082 · #800000

Dramatic Contrast

Excellent for defining distinct content blocks or accentuating graphical elements with a powerful, jewel-toned contrast.

#2F4F4F · #8B0000 · #4B0082

Stained Glass Highlight

Use these for creating striking calls-to-action, important alerts, or intricate graphic motifs against a dark canvas.

#000000 · #8B0000 · #2F4F4F

CSS variables

:root {
  --gothic-cathedral-stain-3-1: #4B0082;
  --gothic-cathedral-stain-3-2: #8B0000;
  --gothic-cathedral-stain-3-3: #2F4F4F;
  --gothic-cathedral-stain-3-4: #800000;
  --gothic-cathedral-stain-3-5: #000000;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gothic-cathedral-stain-3": {
        1: "#4B0082",
        2: "#8B0000",
        3: "#2F4F4F",
        4: "#800000",
        5: "#000000",
      }
    }
  }
}

Related searches

dark elegant color schemesgothic church aesthetic colorsluxury dark design paletterich dramatic web colorsmedieval inspired color combinations

Palette colors

Hex values

Color 1#4B0082
·
Color 2#8B0000
·
Color 3#2F4F4F
·
Color 4#800000
·
Color 5#000000
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.5:1Fail
1.2:1Fail
1.6:1Fail
2
1.3:1Fail
1.1:1Fail
1.1:1Fail
2.1:1Fail
3
1.5:1Fail
1.1:1Fail
1.2:1Fail
2.4:1Fail
4
1.2:1Fail
1.1:1Fail
1.2:1Fail
1.9:1Fail
5
1.6:1Fail
2.1:1Fail
2.4:1Fail
1.9:1Fail

Similar palettes

More like Gothic Cathedral Stain

View all Dark
Deep Space Orchid
Imperial Gemstone Array
Velvet Midnight Lounge
Velvet Study Charm
Velvet Theater Drape
Amethyst Star Cluster