Back to palettes

Palette

Lunar Crag Gloom

Captures the stark, cold beauty and shadowed contours of craters and crags on the moon's surface.

cooldark5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lunar Crag Gloom 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 Lunar Crag Gloom.

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

Data visualization

#1C1C1C#3C3C4C#5C5C6C#9FA4A8#DFE4E8

Palette guide

How to use Lunar Crag Gloom

Overview

The Lunar Crag Gloom palette captures the stark, desolate beauty and shadowed contours of the moon's surface. This cool, mysterious collection features a very dark gray (#1C1C1C), a deep blue-gray (#3C3C4C), a medium blue-gray (#5C5C6C), a lighter gray (#9FA4A8), and a very light cool gray (#DFE4E8). It is an excellent choice for designers and developers aiming to create modern, minimalist, or high-tech visual experiences. The palette's cool, desaturated tones evoke a sense of solemnity, precision, and futuristic elegance, perfect for projects that require a sophisticated and understated aesthetic with depth.

Best used for

  • Tech interfaces and software dashboards
  • Luxury automotive branding
  • Modern architectural visualization
  • Space exploration themes and documentaries
  • Minimalist branding and product design
  • Dark mode UI/UX designs

Suggested color roles

primary

Use #1C1C1C as a strong, grounding primary color for backgrounds in dark mode or for bold headers, providing depth and sophistication.

secondary

Employ #3C3C4C for secondary elements, panels, or content blocks to add subtle atmospheric cool tones.

accent

Apply #9FA4A8 as a subtle highlight for interactive elements, iconography, or key information, mimicking moonlit surfaces.

background

Utilize #DFE4E8 for a clean, expansive light background, or #1C1C1C for a profound dark mode base.

text

For optimal legibility, use #DFE4E8 for text on dark backgrounds, or #1C1C1C for text on lighter backgrounds.

Accessibility notes

  • Ensure high contrast for text, especially when using lighter grays like #9FA4A8 on similar mid-tone backgrounds.
  • For dark mode, verify sufficient contrast between #DFE4E8 text and #1C1C1C background.
  • Avoid using too many similar shades for critical information; differentiate with bolder weights or iconography.
  • Test color combinations under various display settings to maintain readability and visual hierarchy.

Recommended combinations

Dark Lunar Night

Creates a dramatic, high-contrast dark mode aesthetic, ideal for tech interfaces.

#1C1C1C · #3C3C4C · #DFE4E8

Crater Shadows

Offers a subtle gradient of cool grays, perfect for depicting texture or depth in backgrounds.

#5C5C6C · #9FA4A8 · #DFE4E8

Stark Horizon

Provides a balanced contrast, suitable for minimalist designs that need clear separation of elements.

#1C1C1C · #9FA4A8 · #5C5C6C

CSS variables

:root {
  --lunar-crag-gloom-1: #1C1C1C;
  --lunar-crag-gloom-2: #3C3C4C;
  --lunar-crag-gloom-3: #5C5C6C;
  --lunar-crag-gloom-4: #9FA4A8;
  --lunar-crag-gloom-5: #DFE4E8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lunar-crag-gloom": {
        1: "#1C1C1C",
        2: "#3C3C4C",
        3: "#5C5C6C",
        4: "#9FA4A8",
        5: "#DFE4E8",
      }
    }
  }
}

Related searches

dark lunar palettecool gray schememinimalist space colorsmysterious tech palettestark moonscape hues

Palette colors

Hex values

Color 1#1C1C1C
·
Color 2#3C3C4C
·
Color 3#5C5C6C
·
Color 4#9FA4A8
·
Color 5#DFE4E8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.6:1Fail
6.8:1AA
13.3:1AAA
2
1.6:1Fail
1.6:1Fail
4.3:1AA18
8.4:1AAA
3
2.6:1Fail
1.6:1Fail
2.6:1Fail
5.1:1AA
4
6.8:1AA
4.3:1AA18
2.6:1Fail
2:1Fail
5
13.3:1AAA
8.4:1AAA
5.1:1AA
2:1Fail

Similar palettes

More like Lunar Crag Gloom

View all cool