Back to palettes

Palette

Shadowed Granite Depths

A powerful, monochrome blend of deep charcoal and industrial grays, mirroring the enduring strength of granite.

monochromedark5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Shadowed Granite Depths 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 Shadowed Granite Depths.

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

Data visualization

#1F2833#2C3E50#404F5C#5C6F7D#364A5C

Palette guide

How to use Shadowed Granite Depths

Overview

The Shadowed Granite Depths palette delivers a powerful, monochrome blend of deep blues and industrial grays, mirroring the enduring strength and sophistication of granite. It features a profound dark blue-gray #1F2833, progressing through the rich #2C3E50 and #364A5C, to the more pronounced #404F5C and the lighter, reflective #5C6F7D. This collection is ideal for designers and developers seeking a robust, professional, and minimalist aesthetic. Its cool, understated tones provide an excellent foundation for corporate branding, tech interfaces, or any project requiring a sense of stability, authority, and modern elegance without being overly stark.

Best used for

  • Corporate and enterprise websites
  • Tech and software interfaces
  • Industrial design presentations
  • Financial services platforms
  • Modern architectural portfolios
  • Professional news or analytics dashboards

Suggested color roles

primary

#1F2833 serves as a strong, anchoring background for dominant sections or dark mode themes, conveying stability.

secondary

Utilize #2C3E50 or #364A5C for content panels, cards, or navigation, providing clear structural separation.

accent

#5C6F7D can be used for subtle highlights, interactive elements, or iconography, offering a gentle lift.

background

#1F2833 for a deep, commanding base, or #2C3E50 for a slightly softer but still dark canvas.

text

On darker backgrounds, #5C6F7D or a light gray provides excellent legibility. On #5C6F7D, a dark charcoal like #1F2833 works well.

Accessibility notes

  • Ensure sufficient contrast for text, especially when using mid-tones like #404F5C on #5C6F7D.
  • #5C6F7D on #1F2833 should meet WCAG AA for normal text.
  • Avoid using #364A5C or #404F5C for small text on backgrounds with similar lightness.
  • Prioritize high contrast for critical UI elements and small fonts to maintain readability.

Recommended combinations

Granite Base

Creates a strong, deep foundation with a subtle highlight, ideal for dark mode UIs.

#1F2833 · #2C3E50 · #5C6F7D

Stone Layers

For layered designs, providing gentle tonal shifts for cards, panels, or secondary information.

#2C3E50 · #404F5C · #5C6F7D

Industrial Edge

Combines the darkest tones with a robust mid-tone for a solid, professional, and modern aesthetic.

#1F2833 · #364A5C · #404F5C

CSS variables

:root {
  --shadowed-granite-depths-1: #1F2833;
  --shadowed-granite-depths-2: #2C3E50;
  --shadowed-granite-depths-3: #404F5C;
  --shadowed-granite-depths-4: #5C6F7D;
  --shadowed-granite-depths-5: #364A5C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "shadowed-granite-depths": {
        1: "#1F2833",
        2: "#2C3E50",
        3: "#404F5C",
        4: "#5C6F7D",
        5: "#364A5C",
      }
    }
  }
}

Related searches

dark blue gray paletteindustrial ui colorsprofessional dark themegranite inspired web designstrong monochrome palette

Palette colors

Hex values

Color 1#1F2833
·
Color 2#2C3E50
·
Color 3#404F5C
·
Color 4#5C6F7D
·
Color 5#364A5C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.8:1Fail
2.9:1Fail
1.6:1Fail
2
1.4:1Fail
1.3:1Fail
2.1:1Fail
1.2:1Fail
3
1.8:1Fail
1.3:1Fail
1.6:1Fail
1.1:1Fail
4
2.9:1Fail
2.1:1Fail
1.6:1Fail
1.8:1Fail
5
1.6:1Fail
1.2:1Fail
1.1:1Fail
1.8:1Fail

Similar palettes

More like Shadowed Granite Depths

View all monochrome
Ancient Stone Altar
Ancient Tomb Relic
Gothic Cathedral Stone
Gothic Cathedral Stone
Gothic Cathedral Stone
Midnight Ink Spill