Back to palettes

Palette

Misty Forest Glade

A tranquil forest scene shrouded in a gentle mist, with soft greens and deep shadows.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Misty Forest Glade 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 Forest Glade.

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

Data visualization

#CAD7C5#9CB592#6F8B6F#425C47#213B2A

Palette guide

How to use Misty Forest Glade

Overview

The Misty Forest Glade palette portrays a tranquil forest scene shrouded in a gentle mist, with soft greens and deep shadows. Ranging from the light, ethereal #CAD7C5 to the profound #213B2A, this collection is perfect for designs seeking a serene, organic, and sophisticated aesthetic. The harmonious progression through shades like #9CB592 and #6F8B6F offers excellent versatility for creating depth and visual hierarchy in digital and print media. This palette is ideal for projects that aim to convey a sense of peace, environmental connection, and understated elegance.

Best used for

  • Wildlife conservation branding
  • Outdoor lifestyle blogs
  • Eco-friendly product design
  • Meditation and yoga app interfaces
  • Nature-themed educational materials
  • Sustainable agriculture marketing

Suggested color roles

primary

#213B2A - A very deep, almost black, forest green, ideal for main headings, important calls-to-action, or brand identity.

secondary

#425C47 - A deep, muted green, suitable for sub-headings, secondary UI elements, or background panels.

accent

#6F8B6F - A medium, balanced green, perfect for highlights, active states, or graphic accents.

background

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

text

#213B2A - The darkest color, ensuring excellent readability for all body text against lighter backgrounds like #CAD7C5.

Accessibility notes

  • Ensure #213B2A text on #CAD7C5 background meets WCAG contrast standards for clear readability.
  • Avoid using #9CB592 or #CAD7C5 for small text on very light backgrounds due to insufficient contrast.
  • Use #213B2A or #425C47 for critical text and interactive elements.
  • For buttons, ensure the text (e.g., white or #CAD7C5) has strong contrast against the button color (e.g., #425C47).

Recommended combinations

Grounded Header

Deep, legible text on a soft, light background for a serene header.

#213B2A · #CAD7C5 · #9CB592

Subtle CTA

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

#425C47 · #6F8B6F · #9CB592

Natural Gradient

Smooth transition for background sections or hero imagery.

#CAD7C5 · #9CB592 · #6F8B6F

CSS variables

:root {
  --misty-forest-glade-1: #CAD7C5;
  --misty-forest-glade-2: #9CB592;
  --misty-forest-glade-3: #6F8B6F;
  --misty-forest-glade-4: #425C47;
  --misty-forest-glade-5: #213B2A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "misty-forest-glade": {
        1: "#CAD7C5",
        2: "#9CB592",
        3: "#6F8B6F",
        4: "#425C47",
        5: "#213B2A",
      }
    }
  }
}

Related searches

misty green forest palettetranquil glade colorsserene woodland huesmuted nature tonescalm forest design

Palette colors

Hex values

Color 1#CAD7C5
·
Color 2#9CB592
·
Color 3#6F8B6F
·
Color 4#425C47
·
Color 5#213B2A
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.5:1Fail
4.9:1AA
8.1:1AAA
2
1.5:1Fail
1.7:1Fail
3.3:1AA18
5.5:1AA
3
2.5:1Fail
1.7:1Fail
2:1Fail
3.2:1AA18
4
4.9:1AA
3.3:1AA18
2:1Fail
1.7:1Fail
5
8.1:1AAA
5.5:1AA
3.2:1AA18
1.7:1Fail

Similar palettes

More like Misty Forest Glade

View all cool