Back to palettes

Palette

Obsidian Sky Mirror

Deep, reflective shades mirroring the polished surface of obsidian under a dark, dramatic sky.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0D1016#2B2E33#4F5257#75797E#A1A4A8

Palette guide

How to use Obsidian Sky Mirror

Overview

The Obsidian Sky Mirror palette offers a refined spectrum of cool, dark greys and near-blacks, reflecting the polished surface of obsidian under a dramatic sky. From the profound depth of #0D1016 to the atmospheric #2B2E33, this collection is designed for sleek, modern applications. Mid-tones like #4F5257 and #75797E provide elegant transitions, while #A1A4A8 offers a sophisticated light grey for readability. This palette is perfect for creating minimalist, high-tech, or luxury designs, evoking a sense of calm, precision, and understated power. It's an excellent choice for interfaces that prioritize clarity and a contemporary aesthetic.

Best used for

  • Luxury automotive interfaces
  • Modern web and app design
  • High-end fashion branding
  • Digital art portfolios
  • Corporate presentations
  • Minimalist architectural renderings

Suggested color roles

primary

Utilize #0D1016 as the dominant background color to establish a deep, immersive, and elegant foundation.

secondary

Employ #2B2E33 for secondary panels, headers, or card backgrounds, offering a subtle visual break.

accent

Use #A1A4A8 for highlights, interactive elements, or key information to provide a sophisticated, legible contrast.

background

The deep #0D1016 creates a sleek, modern canvas, ideal for dark mode UIs and dramatic visual effects.

text

For primary text, #A1A4A8 offers excellent readability against #0D1016. For subtitles, #75797E works well on darker shades.

Accessibility notes

  • Ensure #A1A4A8 text has sufficient contrast against #0D1016 and #2B2E33 for optimal readability (WCAG AA/AAA).
  • Avoid using #4F5257 text on #2B2E33 backgrounds for critical content due to potential low contrast.
  • Use #75797E for less critical text or subtle UI elements, but always test against background colors.
  • Consider pure white for very small or decorative text elements if #A1A4A8 doesn't provide enough pop.

Recommended combinations

Base & Highlight

A strong foundation for dark themes, with the lightest grey reserved for key interactive elements or text.

#0D1016 · #2B2E33 · #A1A4A8

Subtle Layers

Ideal for creating depth and hierarchy in component designs, like nested cards or detailed forms.

#2B2E33 · #4F5257 · #75797E

Text Contrast

Effective for main content areas where #75797E can be body text and #A1A4A8 can be headings or links.

#0D1016 · #75797E · #A1A4A8

CSS variables

:root {
  --obsidian-sky-mirror-1: #0D1016;
  --obsidian-sky-mirror-2: #2B2E33;
  --obsidian-sky-mirror-3: #4F5257;
  --obsidian-sky-mirror-4: #75797E;
  --obsidian-sky-mirror-5: #A1A4A8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "obsidian-sky-mirror": {
        1: "#0D1016",
        2: "#2B2E33",
        3: "#4F5257",
        4: "#75797E",
        5: "#A1A4A8",
      }
    }
  }
}

Related searches

dark cool grey palettemonochromatic blue-greysleek modern black greyobsidian UI colorsminimalist dark theme

Palette colors

Hex values

Color 1#0D1016
·
Color 2#2B2E33
·
Color 3#4F5257
·
Color 4#75797E
·
Color 5#A1A4A8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.4:1Fail
4.3:1AA18
7.6:1AAA
2
1.4:1Fail
1.7:1Fail
3.1:1AA18
5.4:1AA
3
2.4:1Fail
1.7:1Fail
1.8:1Fail
3.1:1AA18
4
4.3:1AA18
3.1:1AA18
1.8:1Fail
1.8:1Fail
5
7.6:1AAA
5.4:1AA
3.1:1AA18
1.8:1Fail

Similar palettes

More like Obsidian Sky Mirror

View all monochrome
Obsidian Night Flow
Abstract Canvas Swirl
Architectural Grid Hues
Art Gallery Minimal
Basalt Rock Formation
Brushed Steel Aura