Back to palettes

Palette

Obsidian Mountain Peak

A stark and powerful monochromatic palette inspired by the polished, dark grandeur of obsidian.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Obsidian Mountain Peak 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 Obsidian Mountain Peak.

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

Data visualization

#0A0A0A#2E2E2E#5A5A5A#8D8D8D#1F1F1F

Palette guide

How to use Obsidian Mountain Peak

Overview

The Obsidian Mountain Peak palette presents a stark and powerful monochromatic scheme, inspired by the polished, dark grandeur of obsidian. Ranging from the profound #0A0A0A and #1F1F1F, it flows through the deep #2E2E2E and mid-tone #5A5A5A, culminating in the lighter #8D8D8D. This palette is perfect for designers who prioritize a clean, modern, and serious aesthetic, conveying strength and sophistication through its masterful use of dark greys. Developers will find these shades ideal for creating elegant dark mode interfaces, corporate websites, or any application requiring a professional and minimalist look. The subtle variations in tone allow for effective visual hierarchy without relying on color, creating a refined and impactful user experience.

Best used for

  • Corporate websites
  • Professional portfolio sites
  • High-tech product showcases
  • Financial services interfaces
  • Dark mode applications
  • Architectural visualization

Suggested color roles

primary

#0A0A0A - The dominant dark base, providing a sleek, deep background for a sophisticated and modern feel.

secondary

#1F1F1F - Excellent for secondary backgrounds, card elements, or subtle dividers, adding depth without visual clutter.

accent

#2E2E2E - A rich, deep charcoal that can be used for subtle interactive elements, focus states, or a refined brand accent.

background

#0A0A0A - Creates a clean, uncluttered canvas, allowing content to stand out with understated elegance.

text

#8D8D8D - Ideal for body text on darker backgrounds, offering good readability with a soft, neutral tone. Use pure white for higher contrast.

Accessibility notes

  • Ensure #8D8D8D text has sufficient contrast against #0A0A0A, #1F1F1F, and #2E2E2E for WCAG AA compliance.
  • Avoid using #5A5A5A directly on #2E2E2E for critical text due to potentially low contrast.
  • For primary headings or important information, consider using a pure white text on the darkest shades.
  • Check contrast ratios for all text-on-background pairings, especially with the darker greys, to guarantee readability.

Recommended combinations

Monochromatic Depth

Creates a sophisticated, layered dark interface with legible text, perfect for elegant content presentation.

#0A0A0A · #1F1F1F · #8D8D8D

Subtle Structure

Ideal for distinguishing content blocks or navigation menus, providing subtle visual hierarchy through shades of grey.

#1F1F1F · #2E2E2E · #5A5A5A

Peak Highlight

Useful for highlighting specific information within a mid-grey section, using the lightest grey for emphasis.

#5A5A5A · #8D8D8D · #0A0A0A

CSS variables

:root {
  --obsidian-mountain-peak-1: #0A0A0A;
  --obsidian-mountain-peak-2: #2E2E2E;
  --obsidian-mountain-peak-3: #5A5A5A;
  --obsidian-mountain-peak-4: #8D8D8D;
  --obsidian-mountain-peak-5: #1F1F1F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "obsidian-mountain-peak": {
        1: "#0A0A0A",
        2: "#2E2E2E",
        3: "#5A5A5A",
        4: "#8D8D8D",
        5: "#1F1F1F",
      }
    }
  }
}

Related searches

monochromatic grey palettedark rock color schememinimalist dark designcharcoal elegant colorsobsidian black grey theme

Palette colors

Hex values

Color 1#0A0A0A
·
Color 2#2E2E2E
·
Color 3#5A5A5A
·
Color 4#8D8D8D
·
Color 5#1F1F1F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.9:1Fail
6:1AA
1.2:1Fail
2
1.5:1Fail
2:1Fail
4.1:1AA18
1.2:1Fail
3
2.9:1Fail
2:1Fail
2.1:1Fail
2.4:1Fail
4
6:1AA
4.1:1AA18
2.1:1Fail
5:1AA
5
1.2:1Fail
1.2:1Fail
2.4:1Fail
5:1AA

Similar palettes

More like Obsidian Mountain Peak

View all dark
Dark Moody Portrait
Midnight Raven
Obsidian Shard Grey
Volcanic Glass Flow
Abyss Gaze
Abyssal Bioluminescent Glow