Back to palettes

Palette

Ghostly Fog Hues

A progression of cool greys that evoke the soft, muted atmosphere of a foggy landscape.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ghostly Fog Hues 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 Ghostly Fog Hues.

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

Data visualization

#DCDCDC#C0C0C0#A9A9A9#808080#696969

Palette guide

How to use Ghostly Fog Hues

Overview

Ghostly Fog Hues is a subtle and calm monochrome palette, meticulously curated to evoke the soft, muted atmosphere of a foggy landscape. It features a very light grey (#DCDCDC), a classic silver grey (#C0C0C0), a medium grey (#A9A9A9), a solid grey (#808080), and a darker charcoal grey (#696969). This progression of cool greys provides a sophisticated, minimal, and understated aesthetic. Designers and developers can leverage this palette for projects requiring a clean, professional, and timeless feel, where tranquility and clarity are paramount, perfect for elegant interfaces, architectural visuals, or sophisticated branding.

Best used for

  • Minimalist website designs
  • Corporate branding
  • Architectural visualizations
  • High-end product photography backdrops
  • Elegant print collateral
  • User interfaces requiring a calm feel

Suggested color roles

primary

A deep, anchoring charcoal (#696969), perfect for main text, primary navigation, or strong structural elements.

secondary

A versatile medium grey (#808080), suitable for subheadings, borders, or secondary UI components.

accent

Offers a slightly lighter mid-tone (#A9A9A9) for subtle emphasis, hover states, or decorative lines.

background

A very light grey (#DCDCDC) that provides a clean, airy, and unobtrusive canvas for all content.

text

For maximum readability on light backgrounds, use the darkest grey (#696969). For very dark backgrounds (not prominent here), use a very light grey like #DCDCDC.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using lighter greys for text on light backgrounds.
  • Text in #696969 or #808080 provides excellent contrast against #DCDCDC and #C0C0C0.
  • Avoid using #C0C0C0 (silver grey) or #A9A9A9 (medium grey) for small text on #DCDCDC (very light grey) due to low contrast.
  • For interactive elements, ensure distinct visual cues beyond color, especially for users with color vision deficiencies.

Recommended combinations

Misty Depth

Creates a professional, clean look with clear hierarchy for text and backgrounds.

#696969 · #808080 · #DCDCDC

Subtle Gradient

Ideal for soft background transitions or layered graphical elements.

#DCDCDC · #C0C0C0 · #A9A9A9

Anchored Contrast

Provides a balanced contrast for headings or important information within a minimalist layout.

#A9A9A9 · #696969 · #DCDCDC

CSS variables

:root {
  --ghostly-fog-hues-1: #DCDCDC;
  --ghostly-fog-hues-2: #C0C0C0;
  --ghostly-fog-hues-3: #A9A9A9;
  --ghostly-fog-hues-4: #808080;
  --ghostly-fog-hues-5: #696969;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ghostly-fog-hues": {
        1: "#DCDCDC",
        2: "#C0C0C0",
        3: "#A9A9A9",
        4: "#808080",
        5: "#696969",
      }
    }
  }
}

Related searches

monochromatic grey paletteminimalist color schemecalm UI colorsfoggy grey tonesprofessional neutral palette

Palette colors

Hex values

Color 1#DCDCDC
·
Color 2#C0C0C0
·
Color 3#A9A9A9
·
Color 4#808080
·
Color 5#696969
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.9:1Fail
4:1AA18
2
1.3:1Fail
1.3:1Fail
2.2:1Fail
3:1AA18
3
1.7:1Fail
1.3:1Fail
1.7:1Fail
2.3:1Fail
4
2.9:1Fail
2.2:1Fail
1.7:1Fail
1.4:1Fail
5
4:1AA18
3:1AA18
2.3:1Fail
1.4:1Fail

Similar palettes

More like Ghostly Fog Hues

View all monochrome
Whispering Mist
Monochromatic Mist
Pale Stone Serenity
Calm Stone Meditate
Charcoal Sketchbook Grey
Cloud Grey Mirage