Back to palettes

Palette

Gothic Revival Grandeur

Deep, solemn greys and blacks reflecting the majestic, intricate aesthetics of Gothic architecture.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gothic Revival Grandeur 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 Revival Grandeur.

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

Data visualization

#2E2E2E#5A5A5A#8C8C8C#1C1C1C#6B6B6B

Palette guide

How to use Gothic Revival Grandeur

Overview

The "Gothic Revival Grandeur" palette offers a sophisticated selection of deep greys and near-blacks, perfectly capturing the majestic and intricate aesthetic of Gothic architecture. Dominated by hues like the profound #1C1C1C and the rich #2E2E2E, alongside supporting mid-tones such as #5A5A5A and the lighter #8C8C8C, this collection exudes solemnity and elegance. Designers and developers can leverage this palette to create interfaces and branding that demand a sense of luxury, history, and understated power. It's ideal for projects requiring a dramatic yet refined visual presence, providing a robust foundation for high-end digital and print media.

Best used for

  • Luxury brand websites and apps
  • High-end fashion editorial layouts
  • Architectural firm portfolios and presentations
  • Dark mode UI themes for sophisticated applications
  • Elegant event invitations and stationery
  • Art gallery digital exhibits

Suggested color roles

primary

#2E2E2E - A commanding dark grey, excellent for main headings, prominent UI elements, or as a strong background for content blocks.

secondary

#5A5A5A - A versatile mid-grey, perfect for subheadings, distinct content sections, or borders that need to stand out subtly.

accent

#8C8C8C - The lightest grey in the palette, providing a soft but effective contrast for interactive elements, icons, or subtle highlights.

background

#1C1C1C - The deepest, near-black tone, creating a dramatic and elegant backdrop for entire applications or websites, emphasizing content.

text

#6B6B6B - A darker grey suitable for secondary text or subtle labels on lighter backgrounds. For primary body text on #1C1C1C or #2E2E2E, consider using #8C8C8C or a near-white for optimal readability.

Accessibility notes

  • Always verify contrast ratios for text against background, especially when using #6B6B6B on darker tones.
  • Prioritize #8C8C8C for body text on #1C1C1C or #2E2E2E to meet WCAG AA standards.
  • Avoid using #5A5A5A for small text on backgrounds like #2E2E2E as contrast may be insufficient.
  • Ensure interactive elements using lighter shades like #8C8C8C have clear focus states against dark backgrounds.

Recommended combinations

Classic Contrast

Ideal for primary UI elements, providing strong readability for text and clear hierarchy on dark mode applications.

#1C1C1C · #8C8C8C · #2E2E2E

Subtle Layering

Excellent for creating depth through layered backgrounds, distinct content cards, or subtle gradients in elegant designs.

#2E2E2E · #5A5A5A · #6B6B6B

Elegant Accents

Use #8C8C8C for interactive elements like buttons or links on a #1C1C1C background, with #5A5A5A for supporting details.

#1C1C1C · #8C8C8C · #5A5A5A

CSS variables

:root {
  --gothic-revival-grandeur-2-1: #2E2E2E;
  --gothic-revival-grandeur-2-2: #5A5A5A;
  --gothic-revival-grandeur-2-3: #8C8C8C;
  --gothic-revival-grandeur-2-4: #1C1C1C;
  --gothic-revival-grandeur-2-5: #6B6B6B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gothic-revival-grandeur-2": {
        1: "#2E2E2E",
        2: "#5A5A5A",
        3: "#8C8C8C",
        4: "#1C1C1C",
        5: "#6B6B6B",
      }
    }
  }
}

Related searches

dark grey color schemegothic architecture paletteelegant black and grey colorsluxury dark ui colorssophisticated grey palette

Palette colors

Hex values

Color 1#2E2E2E
·
Color 2#5A5A5A
·
Color 3#8C8C8C
·
Color 4#1C1C1C
·
Color 5#6B6B6B
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
4:1AA18
1.3:1Fail
2.5:1Fail
2
2:1Fail
2.1:1Fail
2.5:1Fail
1.3:1Fail
3
4:1AA18
2.1:1Fail
5.1:1AA
1.6:1Fail
4
1.3:1Fail
2.5:1Fail
5.1:1AA
3.2:1AA18
5
2.5:1Fail
1.3:1Fail
1.6:1Fail
3.2:1AA18

Similar palettes

More like Gothic Revival Grandeur

View all dark
Gothic Manor Elegance
Obsidian Glimmer Pool
Art Deco Evening
Art Deco Symmetry
Cathedral Glass Dream
Cathedral Stained Glass