Back to palettes

Palette

Gothic Cathedral Stone

A somber yet stately blend of deep greys and hints of cold blue, inspired by ancient architecture.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2F4F4F#696969#A9A9A9#C0C0C0#4682B4

Palette guide

How to use Gothic Cathedral Stone

Overview

The "Gothic Cathedral Stone" palette offers a somber yet stately blend of deep grays and a hint of cool blue, inspired by ancient, weathered architecture. It features a profound Dark Slate Gray (#2F4F4F), a solid Dim Gray (#696969), a balanced Dark Gray (#A9A9A9), a luminous Silver (#C0C0C0), and a striking Steel Blue (#4682B4). This collection is perfect for designers and developers aiming to convey a sense of history, stability, and understated elegance. These hues provide a versatile foundation for creating structured, sophisticated digital environments, robust branding, or evocative artistic compositions with a timeless, monumental feel.

Best used for

  • Architectural firm websites and portfolios
  • Historical museum or cultural institution branding
  • High-end menswear or minimalist fashion labels
  • Serious editorial design and publishing
  • Industrial design presentations
  • Dark mode UI themes with a cool undertone

Suggested color roles

primary

#2F4F4F (Dark Slate Gray) - A deep, grounding primary that provides a strong, stable foundation for backgrounds or main structural elements.

secondary

#696969 (Dim Gray) - Offers a solid, reliable contrast, excellent for navigation, card backgrounds, or secondary content areas.

accent

#4682B4 (Steel Blue) - A cool, striking accent that adds a touch of solemn elegance, perfect for interactive elements or subtle highlights.

background

#2F4F4F (Dark Slate Gray) - An excellent choice for a deep, immersive background, allowing lighter grays and the blue accent to pop.

text

#C0C0C0 (Silver) - Highly legible against the darker grays, making it ideal for primary body text. #A9A9A9 can be used for secondary text on darker backgrounds.

Accessibility notes

  • Ensure ample contrast by pairing #C0C0C0 or #A9A9A9 with #2F4F4F or #696969 for text.
  • Avoid using #696969 for text on #A9A9A9 or #C0C0C0 as contrast will likely be insufficient.
  • Small text elements should always use the highest contrast pairings, such as white on #2F4F4F.
  • The blue accent #4682B4 will require white or very light gray text for readability.

Recommended combinations

Stone & Sky

Creates a strong, architectural feel, with #2F4F4F as a base, #C0C0C0 for content, and #4682B4 for highlights.

#2F4F4F · #C0C0C0 · #4682B4

Layered Grey

Ideal for subtle depth in UI elements, background gradients, or for differentiating content sections.

#696969 · #A9A9A9 · #C0C0C0

Blue Accent

Use #2F4F4F as a primary background, #4682B4 for significant calls-to-action, and #A9A9A9 for supporting text.

#2F4F4F · #4682B4 · #A9A9A9

CSS variables

:root {
  --gothic-cathedral-stone-2-1: #2F4F4F;
  --gothic-cathedral-stone-2-2: #696969;
  --gothic-cathedral-stone-2-3: #A9A9A9;
  --gothic-cathedral-stone-2-4: #C0C0C0;
  --gothic-cathedral-stone-2-5: #4682B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gothic-cathedral-stone-2": {
        1: "#2F4F4F",
        2: "#696969",
        3: "#A9A9A9",
        4: "#C0C0C0",
        5: "#4682B4",
      }
    }
  }
}

Related searches

gothic stone color palettesarchitectural grey blue schemessomber elegant web designmedieval stone texture colorsdark professional color combinations

Palette colors

Hex values

Color 1#2F4F4F
·
Color 2#696969
·
Color 3#A9A9A9
·
Color 4#C0C0C0
·
Color 5#4682B4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
3.8:1AA18
4.9:1AA
2.2:1Fail
2
1.6:1Fail
2.3:1Fail
3:1AA18
1.3:1Fail
3
3.8:1AA18
2.3:1Fail
1.3:1Fail
1.7:1Fail
4
4.9:1AA
3:1AA18
1.3:1Fail
2.3:1Fail
5
2.2:1Fail
1.3:1Fail
1.7:1Fail
2.3:1Fail

Similar palettes

More like Gothic Cathedral Stone

View all dark