Back to palettes

Palette

Obsidian Depths

A deep and mysterious array of dark tones, echoing the enigmatic allure of a moonless night.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#000000#2C3E50#34495E#1A1A1A#0F0F0F

Palette guide

How to use Obsidian Depths

Overview

The Obsidian Depths palette offers a profoundly dark and mysterious array of tones, perfect for projects requiring elegance, sophistication, and an enigmatic allure. It delves into the deepest blacks with #000000 and #0F0F0F, complemented by the rich charcoals of #1A1A1A. Adding a touch of cool sophistication are the deep blues of #2C3E50 and #34495E, reminiscent of twilight or deep ocean trenches. This palette is exceptionally versatile for designers creating high-end, minimalist, or tech-focused experiences. Developers can utilize its varying dark shades to build layered interfaces that are both visually stunning and highly functional, ensuring a premium feel and excellent contrast for lighter elements.

Best used for

  • High-end fashion websites
  • Luxury tech product interfaces
  • Abstract art platforms
  • Dark mode applications
  • Elegant branding for services
  • Night-themed digital experiences

Suggested color roles

primary

#000000 - The ultimate foundation for backgrounds, providing an elegant and infinite depth for any design.

secondary

#1A1A1A - Ideal for secondary panels, card backgrounds, or subtle borders, offering a slight visual lift from pure black.

accent

#2C3E50 - A sophisticated dark blue, perfect for subtle highlights, interactive elements, or branding accents in a monochrome dark scheme.

background

#0F0F0F - Creates a deep, uniform canvas that allows lighter content, especially white text, to truly pop.

text

Pure white or a very light grey offers the best readability against these deep darks, making content stand out clearly.

Accessibility notes

  • Always use light text (e.g., white or light grey) against #000000, #0F0F0F, #1A1A1A, #2C3E50, and #34495E to ensure WCAG AA compliance.
  • Avoid using any of the palette's dark colors for text on another dark color from the same palette, as contrast will be insufficient.
  • Ensure interactive elements using #2C3E50 or #34495E have a clear visual state change for users.
  • For critical information, use a high-contrast pairing, such as white text on #000000.

Recommended combinations

Midnight Elegance

Creates a sophisticated dark interface with a subtle blue accent, ideal for navigation or key interactive elements.

#000000 · #2C3E50 · #1A1A1A

Deep Layers

Excellent for building layered backgrounds or card systems, providing depth with varying dark shades and a hint of blue.

#0F0F0F · #1A1A1A · #34495E

Stealth Contrast

Useful for creating a subtle, almost invisible border or shadow effect, with the blue as a discrete highlight.

#1A1A1A · #000000 · #2C3E50

CSS variables

:root {
  --obsidian-depths-1: #000000;
  --obsidian-depths-2: #2C3E50;
  --obsidian-depths-3: #34495E;
  --obsidian-depths-4: #1A1A1A;
  --obsidian-depths-5: #0F0F0F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "obsidian-depths": {
        1: "#000000",
        2: "#2C3E50",
        3: "#34495E",
        4: "#1A1A1A",
        5: "#0F0F0F",
      }
    }
  }
}

Related searches

deep dark color schemeblack and blue paletteelegant charcoal designmysterious night colorsminimalist dark theme

Palette colors

Hex values

Color 1#000000
·
Color 2#2C3E50
·
Color 3#34495E
·
Color 4#1A1A1A
·
Color 5#0F0F0F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
2.3:1Fail
1.2:1Fail
1.1:1Fail
2
1.9:1Fail
1.2:1Fail
1.6:1Fail
1.7:1Fail
3
2.3:1Fail
1.2:1Fail
1.9:1Fail
2.1:1Fail
4
1.2:1Fail
1.6:1Fail
1.9:1Fail
1.1:1Fail
5
1.1:1Fail
1.7:1Fail
2.1:1Fail
1.1:1Fail

Similar palettes

More like Obsidian Depths

View all dark