Back to palettes

Palette

Gothic Stained Glass

Rich, deep jewel tones reminiscent of the intricate and dramatic beauty of gothic stained glass.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gothic Stained Glass 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 Stained Glass.

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

Data visualization

#3D004F#8F0022#D41C34#006064#00363A

Palette guide

How to use Gothic Stained Glass

Overview

The Gothic Stained Glass palette presents a captivating array of rich, deep jewel tones reminiscent of intricate church windows. It features a profound violet #3D004F, a vibrant ruby #8F0022, a striking crimson #D41C34, a deep teal #006064, and a foundational dark aqua #00363A. This collection offers dramatic contrasts and an artistic flair, making it perfect for designs that aim to be bold, luxurious, and visually impactful. Designers can leverage these hues to create an atmosphere of elegance and mystery, drawing inspiration from historic artistry and opulent aesthetics.

Best used for

  • Artistic portfolio websites
  • Luxury product branding
  • Creative agency presentations
  • Theatrical production marketing
  • High-end fashion photography
  • Exclusive event invitations

Suggested color roles

primary

Use #3D004F as a deep, enigmatic primary color for large areas, setting a mysterious and sophisticated tone.

secondary

Employ #006064 for supportive elements, adding a rich, contrasting teal that complements the purples and reds.

accent

Reserve #D41C34 for vibrant highlights, call-to-action buttons, or to draw immediate attention with its striking crimson.

background

Choose #00363A as a very dark, grounding background that allows the vibrant jewel tones to truly pop and glow.

text

Utilize a light, near-white (e.g., #EEEEEE) for general body text on dark backgrounds, with #D41C34 for key headings or accents.

Accessibility notes

  • Ensure sufficient contrast between light text and the darker colors like #3D004F and #00363A for WCAG compliance.
  • Avoid using #8F0022 or #D41C34 for small body text, as their intensity might reduce readability on certain backgrounds.
  • Test color combinations for color blindness, especially the red and green hues, which can be challenging.
  • For optimal legibility, use a very dark charcoal for text on any lighter, near-white background.

Recommended combinations

Dramatic Glow

A dark, deep teal base with a fiery crimson accent and mysterious purple for high impact.

#00363A · #D41C34 · #3D004F

Jewel Harmony

A balanced blend of deep violet, rich teal, and ruby red for sophisticated visual compositions.

#3D004F · #006064 · #8F0022

Rich Depth

Layers of dark teal with a vibrant crimson accent, creating depth and a focal point.

#00363A · #006064 · #D41C34

CSS variables

:root {
  --gothic-stained-glass-2-1: #3D004F;
  --gothic-stained-glass-2-2: #8F0022;
  --gothic-stained-glass-2-3: #D41C34;
  --gothic-stained-glass-2-4: #006064;
  --gothic-stained-glass-2-5: #00363A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gothic-stained-glass-2": {
        1: "#3D004F",
        2: "#8F0022",
        3: "#D41C34",
        4: "#006064",
        5: "#00363A",
      }
    }
  }
}

Related searches

gothic jewel tone palettedramatic stained glass colorsdeep artistic huesrich purple red tealelegant dark palette

Palette colors

Hex values

Color 1#3D004F
·
Color 2#8F0022
·
Color 3#D41C34
·
Color 4#006064
·
Color 5#00363A
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
3.1:1AA18
2.2:1Fail
1.2:1Fail
2
1.7:1Fail
1.8:1Fail
1.3:1Fail
1.4:1Fail
3
3.1:1AA18
1.8:1Fail
1.4:1Fail
2.5:1Fail
4
2.2:1Fail
1.3:1Fail
1.4:1Fail
1.8:1Fail
5
1.2:1Fail
1.4:1Fail
2.5:1Fail
1.8:1Fail

Similar palettes

More like Gothic Stained Glass

View all dark