Back to palettes

Palette

Misty Fenland Dew

Soft and ethereal, like the tranquil haze of morning mist over a damp, ancient fenland.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Misty Fenland Dew 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 Misty Fenland Dew.

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

Data visualization

#5F7C7C#8EA19E#BFCECC#DEE9E8#3A5757

Palette guide

How to use Misty Fenland Dew

Overview

The Misty Fenland Dew palette evokes the serene and tranquil haze of morning mist over a damp, ancient fenland with its ethereal blend of grey-greens. Ranging from the deep, grounding #3A5757 to the soft, near-white #DEE9E8, this collection is perfect for designs seeking a calm, natural, and sophisticated aesthetic. The subtle variations between #5F7C7C and #8EA19E provide excellent depth for creating visual interest without being overly vibrant. This palette is ideal for projects that aim to convey a sense of peace, environmental consciousness, or understated elegance.

Best used for

  • Eco-friendly product branding
  • Wellness and mindfulness apps
  • Nature conservation websites
  • Spa and retreat marketing
  • Sustainable fashion designs
  • Serene home decor themes

Suggested color roles

primary

#3A5757 - A deep, muted teal-grey, ideal for main headings, important calls-to-action, or brand identity.

secondary

#5F7C7C - A medium grey-green, suitable for sub-headings, secondary UI elements, or background panels.

accent

#8EA19E - A lighter, soft grey-green, perfect for subtle highlights, borders, or active states.

background

#DEE9E8 - A very light, airy grey-green that provides a clean, calming, and expansive canvas.

text

#3A5757 - The darkest color, ensuring excellent readability for all body text against lighter backgrounds like #DEE9E8.

Accessibility notes

  • Ensure #3A5757 text on #DEE9E8 background meets WCAG contrast standards for clear readability.
  • Avoid using #BFCECC or #DEE9E8 for small text on very light backgrounds due to insufficient contrast.
  • Use #3A5757 or #5F7C7C for critical text and interactive elements.
  • For buttons, ensure the text (e.g., white or #DEE9E8) has strong contrast against the button color (e.g., #5F7C7C).

Recommended combinations

Natural Header

Deep text on a light, ethereal background for a clean, natural header.

#3A5757 · #DEE9E8 · #5F7C7C

Subtle CTA

A primary button with a lighter, gentle hover or pressed state.

#5F7C7C · #8EA19E · #BFCECC

UI Panel

Creating subtle visual separation for cards or information panels.

#DEE9E8 · #BFCECC · #3A5757

CSS variables

:root {
  --misty-fenland-dew-1: #5F7C7C;
  --misty-fenland-dew-2: #8EA19E;
  --misty-fenland-dew-3: #BFCECC;
  --misty-fenland-dew-4: #DEE9E8;
  --misty-fenland-dew-5: #3A5757;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "misty-fenland-dew": {
        1: "#5F7C7C",
        2: "#8EA19E",
        3: "#BFCECC",
        4: "#DEE9E8",
        5: "#3A5757",
      }
    }
  }
}

Related searches

misty green grey palettetranquil fenland colorsserene nature huesmuted teal tonescalm wetland design

Palette colors

Hex values

Color 1#5F7C7C
·
Color 2#8EA19E
·
Color 3#BFCECC
·
Color 4#DEE9E8
·
Color 5#3A5757
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.8:1Fail
3.6:1AA18
1.7:1Fail
2
1.7:1Fail
1.7:1Fail
2.2:1Fail
2.9:1Fail
3
2.8:1Fail
1.7:1Fail
1.3:1Fail
4.8:1AA
4
3.6:1AA18
2.2:1Fail
1.3:1Fail
6.3:1AA
5
1.7:1Fail
2.9:1Fail
4.8:1AA
6.3:1AA

Similar palettes

More like Misty Fenland Dew

View all cool