Back to palettes

Palette

Misted Woodland Path

Soft, muted greens and grays reflecting a serene woodland path veiled in morning mist.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Misted Woodland Path 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 Misted Woodland Path.

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

Data visualization

#2E463E#5C775D#8EB08C#BBD3C5#E3EBEF

Palette guide

How to use Misted Woodland Path

Overview

The 'Misted Woodland Path' palette captures the serene essence of a forest veiled in morning mist, blending soft, muted greens and grays. This collection, featuring the deep #2E463E, calming #5C775D, and ethereal #E3EBEF, offers designers a tranquil foundation for projects seeking peace and natural elegance. The subtle shifts between hues like #8EB08C and #BBD3C5 allow for gentle visual transitions and depth. Developers will find these harmonious hex codes excellent for crafting user interfaces that promote calm, ideal for projects requiring a sense of introspection, natural beauty, and understated sophistication in their visual language.

Best used for

  • Wellness and mindfulness platforms
  • Nature and outdoor apparel brands
  • Sustainable living content
  • Meditation app interfaces
  • Eco-friendly product design
  • Serene interior design concepts

Suggested color roles

primary

A muted forest green (#5C775D), suitable for main content areas or primary navigation, offering a stable, natural feel.

secondary

A lighter, misty green (#8EB08C), ideal for subheadings, secondary buttons, or supporting graphical elements.

accent

A deep, grounding forest shade (#2E463E), perfect for impactful calls-to-action, interactive elements, or a strong footer color.

background

A very light, almost white gray-blue (#E3EBEF), serving as a clean, unobtrusive canvas that enhances content without distraction.

text

For body text, a dark charcoal or black provides optimal readability. For headings, #2E463E offers a clear, natural option against lighter backgrounds.

Accessibility notes

  • Ensure sufficient contrast for text when using #E3EBEF or #BBD3C5 as backgrounds; darker text is essential.
  • The contrast between #8EB08C and #BBD3C5 is low; use carefully for small text or critical UI elements.
  • Pair #2E463E with the lightest shades for excellent readability on calls-to-action or important information.
  • Always test text legibility on all background shades, especially for users with visual impairments.

Recommended combinations

Misty Gradient

Creates a soft, ethereal gradient perfect for serene backgrounds or header effects, evoking a misty forest.

#E3EBEF · #BBD3C5 · #8EB08C

Woodland Focus

Uses a light background with a soft primary and a grounding accent for key information and strong visual hierarchy.

#E3EBEF · #5C775D · #2E463E

Path Layers

Suitable for content blocks or sections where a cohesive, slightly deeper muted green tone is desired.

#BBD3C5 · #8EB08C · #5C775D

CSS variables

:root {
  --misted-woodland-path-1: #2E463E;
  --misted-woodland-path-2: #5C775D;
  --misted-woodland-path-3: #8EB08C;
  --misted-woodland-path-4: #BBD3C5;
  --misted-woodland-path-5: #E3EBEF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "misted-woodland-path": {
        1: "#2E463E",
        2: "#5C775D",
        3: "#8EB08C",
        4: "#BBD3C5",
        5: "#E3EBEF",
      }
    }
  }
}

Related searches

misty forest color palettecalm woodland greensserene nature designmuted earthy tonesfoggy landscape colors

Palette colors

Hex values

Color 1#2E463E
·
Color 2#5C775D
·
Color 3#8EB08C
·
Color 4#BBD3C5
·
Color 5#E3EBEF
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.1:1Fail
4.2:1AA18
6.4:1AA
8.4:1AAA
2
2.1:1Fail
2.1:1Fail
3.1:1AA18
4.1:1AA18
3
4.2:1AA18
2.1:1Fail
1.5:1Fail
2:1Fail
4
6.4:1AA
3.1:1AA18
1.5:1Fail
1.3:1Fail
5
8.4:1AAA
4.1:1AA18
2:1Fail
1.3:1Fail

Similar palettes

More like Misted Woodland Path

View all cool
Emerald Bough Serene
Evergreen Forest Retreat
Forest Canopy Glimmer
Misty Forest Veil
Whispering Willow Grove
Deep Forest Lull