Back to palettes

Palette

Morning Fog Grey

A serene grayscale gradient reflecting the soft, muted tones of a foggy morning.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Morning Fog Grey 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 Morning Fog Grey.

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

Data visualization

#6C7A89#95A5A6#BDC3C7#E4E7E7#4E5D6C

Palette guide

How to use Morning Fog Grey

Overview

The "Morning Fog Grey" palette delivers a serene grayscale gradient, perfectly mirroring the soft, muted tones of a foggy morning. Featuring #6C7A89 (Cadet Grey), #95A5A6 (Light Slate Grey), #BDC3C7 (Silver Sand), #E4E7E7 (Near White), and #4E5D6C (Dark Cadet Grey), this collection offers a truly minimalist and sophisticated aesthetic. Designers can effectively use these cool greys to create clean, professional interfaces, strong corporate branding, or any project that aims for a modern, understated, and highly functional visual presence. It's an excellent choice for conveying professionalism and clarity.

Best used for

  • Corporate and business websites
  • Minimalist app interfaces
  • Tech and software product branding
  • Architectural portfolios
  • Data-heavy dashboards
  • Modern urban lifestyle blogs

Suggested color roles

primary

#E4E7E7 - A very light, almost-white grey, ideal for expansive, clean backgrounds and main content areas.

secondary

#BDC3C7 - A soft, light silver-grey, excellent for secondary backgrounds, card elements, or subtle section dividers.

accent

#4E5D6C - The darkest grey, perfect for strong headings, primary text, or bold interactive elements for maximum contrast.

background

#95A5A6 - A balanced, mid-tone light slate grey, offering a calm and professional backdrop for content.

text

#6C7A89 - A dark cadet grey, highly suitable for body text on lighter backgrounds like #E4E7E7 and #BDC3C7, ensuring excellent readability.

Accessibility notes

  • #4E5D6C and #6C7A89 provide excellent contrast for text on #E4E7E7 and #BDC3C7.
  • Ensure good contrast when using #95A5A6 for text on #BDC3C7; always verify with a contrast checker.
  • Interactive elements should clearly indicate their state (e.g., hover, focus) even with subtle color shifts.
  • This palette generally offers good contrast potential between its light and dark ends.

Recommended combinations

Minimal Base

#E4E7E7 as main background, #BDC3C7 for cards, and #95A5A6 for dividers or sub-sections.

#E4E7E7 · #BDC3C7 · #95A5A6

Professional Contrast

#E4E7E7 as a clean canvas, #4E5D6C for strong headings/buttons, and #6C7A89 for body text.

#E4E7E7 · #4E5D6C · #6C7A89

Layered Depth

#95A5A6 for background, #6C7A89 for sub-elements, and #4E5D6C for primary text or icons.

#95A5A6 · #6C7A89 · #4E5D6C

CSS variables

:root {
  --morning-fog-grey-1: #6C7A89;
  --morning-fog-grey-2: #95A5A6;
  --morning-fog-grey-3: #BDC3C7;
  --morning-fog-grey-4: #E4E7E7;
  --morning-fog-grey-5: #4E5D6C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "morning-fog-grey": {
        1: "#6C7A89",
        2: "#95A5A6",
        3: "#BDC3C7",
        4: "#E4E7E7",
        5: "#4E5D6C",
      }
    }
  }
}

Related searches

monochromatic grey palettecool grey UI designminimalist web color schemeprofessional subtle hex codesurban calm interface colors

Palette colors

Hex values

Color 1#6C7A89
·
Color 2#95A5A6
·
Color 3#BDC3C7
·
Color 4#E4E7E7
·
Color 5#4E5D6C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.5:1Fail
3.5:1AA18
1.5:1Fail
2
1.7:1Fail
1.4:1Fail
2.1:1Fail
2.6:1Fail
3
2.5:1Fail
1.4:1Fail
1.4:1Fail
3.8:1AA18
4
3.5:1AA18
2.1:1Fail
1.4:1Fail
5.4:1AA
5
1.5:1Fail
2.6:1Fail
3.8:1AA18
5.4:1AA

Similar palettes

More like Morning Fog Grey

View all monochrome
Cloud Grey Mirage
Ghostly Fog Hues
Monochromatic Foggy City
Monochromatic Mist
Monochrome Ash Veil
Pale Stone Serenity