Palette

Whispering Willow Grove

Soft, muted greens and grays reminiscent of the gentle, tranquil sway of willow trees in a peaceful grove.

NeutralCalm5 colors

More Neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Whispering Willow Grove 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 Whispering Willow Grove.

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

Data visualization

#4C554F#728C7B#98C3A4#C0E1C9#E3F2E7

Palette guide

How to use Whispering Willow Grove

Overview

The Whispering Willow Grove palette offers a serene collection of soft, muted greens and grays, perfect for creating a tranquil and natural aesthetic. With shades like the deep gray-green #4C554F and the lighter, airy #E3F2E7, this palette provides a harmonious blend that evokes peace. Designers and developers can leverage the versatility of #98C3A4 for primary elements and #728C7B for subtle depth, ensuring a cohesive and calming user experience across various digital and print applications. It's ideal for projects aiming for understated elegance and organic appeal.

Best used for

Eco-friendly brand identity
Spa and wellness websites
Meditation app interfaces
Nature photography backdrops
Sustainable product packaging
Peaceful interior design concepts

Suggested color roles

primary

#728C7B - A balanced, natural green that can serve as a primary brand color, buttons, or main content sections, offering a calming presence.

secondary

#4C554F - A deep, grounding gray-green ideal for navigation bars, footers, or subtle headers, providing strong contrast without being harsh.

accent

#98C3A4 - A brighter, yet still muted, green perfect for call-to-action buttons, interactive elements, or highlighting key information, drawing attention gently.

background

#E3F2E7 - A very light, almost off-white green that creates a clean, airy canvas for content, ensuring readability and a fresh feel.

text

#4C554F - Excellent for body text on light backgrounds like #E3F2E7, offering good legibility and maintaining the palette's natural tone. A dark charcoal like #333333 also works well.

Accessibility notes

Ensure sufficient contrast when using #C0E1C9 or #E3F2E7 for text, especially on similar light backgrounds.
Pair darker shades like #4C554F with lighter backgrounds such as #E3F2E7 for optimal text readability (WCAG AA compliant).
Avoid placing #98C3A4 text directly on #C0E1C9 backgrounds without careful contrast checking.
Use a contrast checker tool to verify readability for all text and interactive elements, especially for users with visual impairments.

Recommended combinations

Forest Depth

Ideal for headers, footers, and primary sections where a sense of depth and natural grounding is desired.

#4C554F · #728C7B · #98C3A4

Willow Breeze

Perfect for light, airy interfaces, backgrounds, and subtle design elements that need a fresh and gentle feel.

#E3F2E7 · #C0E1C9 · #98C3A4

Grove Highlights

Effective for main content areas, interactive components, and feature sections, balancing softness with clear definition.

#728C7B · #98C3A4 · #4C554F

CSS variables

:root {
  --whispering-willow-grove-4-1: #4C554F;
  --whispering-willow-grove-4-2: #728C7B;
  --whispering-willow-grove-4-3: #98C3A4;
  --whispering-willow-grove-4-4: #C0E1C9;
  --whispering-willow-grove-4-5: #E3F2E7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "whispering-willow-grove-4": {
        1: "#4C554F",
        2: "#728C7B",
        3: "#98C3A4",
        4: "#C0E1C9",
        5: "#E3F2E7",
      }
    }
  }
}

Hex values

Color 1#4C554F

Color 2#728C7B

Color 3#98C3A4

Color 4#C0E1C9

Color 5#E3F2E7

Accessibility

Contrast checker

2.1:1Fail

3.9:1AA18

5.5:1AA

6.7:1AA

2.1:1Fail

1.9:1Fail

2.6:1Fail

3.1:1AA18

3.9:1AA18

1.9:1Fail

1.4:1Fail

1.7:1Fail

5.5:1AA

2.6:1Fail

1.4:1Fail

1.2:1Fail

6.7:1AA

3.1:1AA18

1.7:1Fail

1.2:1Fail

Similar palettes

More like Whispering Willow Grove

View all Neutral

Foggy Pine Retreat

Clouded Moon Reflection