Back to palettes

Palette

Foggy River Morning

Muted, soft grays and blues that capture the quiet stillness and cool atmosphere of a foggy river morning.

neutralcalm5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Foggy River Morning 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 Foggy River Morning.

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

Data visualization

#708090#9FB6CD#B0C4DE#CFCFCF#DCDCDC

Palette guide

How to use Foggy River Morning

Overview

The Foggy River Morning palette presents muted, soft grays and blues that capture the quiet stillness and cool atmosphere of a river at dawn. This neutral collection, ranging from slate grey #708090 to off-white #DCDCDC, is perfect for conveying calm, serenity, and a sense of quiet grandeur. Designers and developers can leverage these harmonious tones to build minimalist interfaces, sophisticated branding, or evocative digital landscapes. The subtle shifts between shades provide depth and tranquility, making it ideal for projects that aim for a refined, understated, and timeless aesthetic.

Best used for

  • Serene branding for wellness or lifestyle products
  • Minimalist web design and app interfaces
  • Environmental and nature-focused content
  • Calming interior design concepts
  • Photography portfolios with a soft, ethereal mood
  • Corporate websites needing a peaceful, trustworthy feel

Suggested color roles

primary

Use #708090 for main content, strong typography, or foundational elements to establish a grounding presence.

secondary

Apply #9FB6CD for supporting text, navigation, or subtle dividers, offering a gentle, cool blue contrast.

accent

Utilize #B0C4DE for soft highlights, interactive states, or delicate graphical details, introducing a touch of cool blue.

background

The very light #DCDCDC serves as an excellent primary background, creating a clean, airy, and expansive canvas.

text

#708090 or a true charcoal provides optimal readability on lighter backgrounds like #DCDCDC or #CFCFCF.

Accessibility notes

  • Ensure sufficient contrast for text, especially when pairing lighter shades like #CFCFCF on #DCDCDC.
  • For critical information, use darker text colors such as #708090 against the lightest backgrounds.
  • Avoid using mid-tone colors for small text on similarly toned backgrounds, as readability may suffer.
  • Provide ample spacing and clear typography to enhance readability within this subtle palette.

Recommended combinations

River Mist

For creating a light, ethereal feel, perfect for header areas or clean UI elements with a touch of blue.

#DCDCDC · #CFCFCF · #B0C4DE

Deep Water

Ideal for layered designs, adding depth to sections while maintaining a serene, watery atmosphere.

#708090 · #9FB6CD · #B0C4DE

Morning Calm

A smooth gradient for backgrounds or large sections, conveying a gentle and calming transition.

#9FB6CD · #CFCFCF · #DCDCDC

CSS variables

:root {
  --foggy-river-morning-1: #708090;
  --foggy-river-morning-2: #9FB6CD;
  --foggy-river-morning-3: #B0C4DE;
  --foggy-river-morning-4: #CFCFCF;
  --foggy-river-morning-5: #DCDCDC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "foggy-river-morning": {
        1: "#708090",
        2: "#9FB6CD",
        3: "#B0C4DE",
        4: "#CFCFCF",
        5: "#DCDCDC",
      }
    }
  }
}

Related searches

grey blue water paletteserene river colorssubtle mist thememinimalist cool tonescalm nature UI

Palette colors

Hex values

Color 1#708090
·
Color 2#9FB6CD
·
Color 3#B0C4DE
·
Color 4#CFCFCF
·
Color 5#DCDCDC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
2.3:1Fail
2.6:1Fail
3:1Fail
2
1.9:1Fail
1.2:1Fail
1.3:1Fail
1.5:1Fail
3
2.3:1Fail
1.2:1Fail
1.1:1Fail
1.3:1Fail
4
2.6:1Fail
1.3:1Fail
1.1:1Fail
1.1:1Fail
5
3:1Fail
1.5:1Fail
1.3:1Fail
1.1:1Fail

Similar palettes

More like Foggy River Morning

View all neutral