Back to palettes

Palette

Midnight Raven Glare

A mysterious and deep palette, mirroring the dark sheen of a raven's feathers under moonlight.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Midnight Raven Glare 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 Midnight Raven Glare.

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

Data visualization

#0D0D0F#1A1A1D#2F2F33#45454A#5C5C63

Palette guide

How to use Midnight Raven Glare

Overview

The Midnight Raven Glare palette offers a sleek and sophisticated gradient of dark grays, from an almost-black base to a subtle mid-gray. Featuring #0D0D0F, #1A1A1D, #2F2F33, #45454A, and #5C5C63, this collection is perfect for creating a minimalist, modern, and mysterious aesthetic. It's genuinely useful for designers and developers seeking to convey professionalism, cutting-edge technology, or understated luxury through a refined, near-monochromatic color scheme that avoids harsh true black.

Best used for

  • Minimalist UI design and applications
  • Tech branding and corporate websites
  • Luxury automotive websites and marketing
  • Dark mode implementations for software
  • Sophisticated photography portfolios
  • Cybersecurity interfaces and dashboards

Suggested color roles

primary

Use #0D0D0F (deepest gray) as the primary background or dominant color for a sleek foundation.

secondary

Employ #1A1A1D (subtle dark gray) for secondary backgrounds, borders, or subtle depth.

accent

Apply #5C5C63 (lightest gray) for subtle highlights, active states, or small interactive elements.

background

Utilize #0D0D0F for a sleek, deep background that provides a sophisticated canvas.

text

For readability, use #5C5C63 or a brighter white/light gray on the darker backgrounds.

Accessibility notes

  • Contrast is crucial; ensure #5C5C63 text has sufficient contrast on #0D0D0F and #1A1A1D.
  • Avoid using #1A1A1D or #2F2F33 for text on #0D0D0F, as contrast will be very low and unreadable.
  • For primary body text, consider a brighter white (#FFFFFF) against the darkest shades for optimal readability.
  • Use larger font sizes or bolding when using colors with lower contrast to improve legibility.

Recommended combinations

Sleek Base

For a subtle depth in UI elements, combining a deep base with a light touch for text or icons.

#0D0D0F · #1A1A1D · #5C5C63

Grayscale Depth

Creating smooth, atmospheric gradients for backgrounds or layered graphic elements.

#1A1A1D · #2F2F33 · #45454A

Modern Contrast

Achieving clear distinction for UI elements like cards, buttons, or navigation.

#0D0D0F · #45454A · #5C5C63

CSS variables

:root {
  --midnight-raven-glare-1: #0D0D0F;
  --midnight-raven-glare-2: #1A1A1D;
  --midnight-raven-glare-3: #2F2F33;
  --midnight-raven-glare-4: #45454A;
  --midnight-raven-glare-5: #5C5C63;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-raven-glare": {
        1: "#0D0D0F",
        2: "#1A1A1D",
        3: "#2F2F33",
        4: "#45454A",
        5: "#5C5C63",
      }
    }
  }
}

Related searches

dark gray aestheticminimalist black palettesophisticated ui colorstech company brandingdeep charcoal scheme

Palette colors

Hex values

Color 1#0D0D0F
·
Color 2#1A1A1D
·
Color 3#2F2F33
·
Color 4#45454A
·
Color 5#5C5C63
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.5:1Fail
2:1Fail
2.9:1Fail
2
1.1:1Fail
1.3:1Fail
1.8:1Fail
2.6:1Fail
3
1.5:1Fail
1.3:1Fail
1.4:1Fail
2:1Fail
4
2:1Fail
1.8:1Fail
1.4:1Fail
1.4:1Fail
5
2.9:1Fail
2.6:1Fail
2:1Fail
1.4:1Fail

Similar palettes

More like Midnight Raven Glare

View all dark
Obsidian Nightfall Depth
Onyx Marble Ink
Raven Feather Shroud
Abyss Gaze
Abyssal Bioluminescent Glow
Abyssal Coral Glow