Back to palettes

Palette

Gothic Revival Grandeur

A stately range of dark, muted greys and steely blues, embodying the somber grandeur of a Gothic Revival edifice.

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

#2F4F4F#4A5B5B#6A7B7B#8B9B9B#AABBBB

Palette guide

How to use Gothic Revival Grandeur

Overview

The Gothic Revival Grandeur palette offers a sophisticated range of dark, muted greys and cool, steely blues, perfect for projects seeking an elegant and historic aesthetic. Anchored by the deep #2F4F4F, this collection subtly progresses through #4A5B5B and #6A7B7B to lighter, yet still subdued, tones like #8B9B9B and #AABBBB. Designers can leverage its somber grandeur to evoke a sense of timelessness and refined dignity. Developers will find these hues versatile for creating compelling UIs that require depth without being overly vibrant, ideal for luxury branding, editorial layouts, or architectural visualizations. This palette masterfully balances coolness with a grounding presence.

Best used for

  • Luxury brand websites and packaging
  • High-end editorial design (magazines, books)
  • Architectural portfolios and visualizations
  • Historical drama film or game aesthetics
  • Elegant event invitations and branding
  • Sophisticated interior design concepts

Suggested color roles

primary

#2F4F4F - Use this deepest shade for dominant elements, large backgrounds, or significant UI components to establish a strong, foundational elegance.

secondary

#4A5B5B - Ideal for supporting sections, headers, or card backgrounds, offering a slightly lighter contrast while maintaining the palette's somber mood.

accent

#6A7B7B - A subtle, sophisticated accent for interactive elements, highlights, or secondary calls-to-action that require a touch of distinction without boldness.

background

#AABBBB - A light, airy background for content areas, providing a clean canvas that still resonates with the cool, muted theme.

text

For primary body text, a dark charcoal or near-black like #333333 offers optimal readability against lighter palette colors. Against darker backgrounds, use #AABBBB or pure white for contrast.

Accessibility notes

  • Ensure sufficient contrast when pairing #2F4F4F or #4A5B5B with text; often, white or #AABBBB will be necessary.
  • Avoid using #6A7B7B as primary text color on backgrounds like #8B9B9B due to insufficient contrast for readability.
  • Small text elements should ideally use the highest contrast pairings, such as dark charcoal on #AABBBB.
  • When designing for forms or interactive states, test color combinations thoroughly to maintain clear visual cues for all users.

Recommended combinations

Deep Foundations

Perfect for a strong, authoritative header or a dark mode theme where #AABBBB provides readable text against the deep base.

#2F4F4F · #4A5B5B · #AABBBB

Subtle Contrast

Ideal for secondary content blocks, cards, or layered UI elements where a gentle visual hierarchy is desired.

#4A5B5B · #8B9B9B · #6A7B7B

Light & Shadow

Use for main content areas, with #AABBBB as the background, #6A7B7B for subheadings, and #2F4F4F for striking accents or important icons.

#AABBBB · #6A7B7B · #2F4F4F

CSS variables

:root {
  --gothic-revival-grandeur-1: #2F4F4F;
  --gothic-revival-grandeur-2: #4A5B5B;
  --gothic-revival-grandeur-3: #6A7B7B;
  --gothic-revival-grandeur-4: #8B9B9B;
  --gothic-revival-grandeur-5: #AABBBB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gothic-revival-grandeur": {
        1: "#2F4F4F",
        2: "#4A5B5B",
        3: "#6A7B7B",
        4: "#8B9B9B",
        5: "#AABBBB",
      }
    }
  }
}

Related searches

gothic grey color schemeelegant dark cool palettesteely blue grey colorshistoric architectural palettesomber sophisticated design

Palette colors

Hex values

Color 1#2F4F4F
·
Color 2#4A5B5B
·
Color 3#6A7B7B
·
Color 4#8B9B9B
·
Color 5#AABBBB
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
2:1Fail
3.1:1AA18
4.5:1AA18
2
1.2:1Fail
1.6:1Fail
2.5:1Fail
3.6:1AA18
3
2:1Fail
1.6:1Fail
1.5:1Fail
2.2:1Fail
4
3.1:1AA18
2.5:1Fail
1.5:1Fail
1.5:1Fail
5
4.5:1AA18
3.6:1AA18
2.2:1Fail
1.5:1Fail

Similar palettes

More like Gothic Revival Grandeur

View all Dark
Cinema Noir Velvet
Midnight Cherry Blossom
Nocturnal Rose Bloom
Pearl Night Elegance
Regal Theatre Curtains
Velvet Evening Gown