Back to palettes

Palette

Forest Floor Duet

Reflects the subtle, muted tones of a peaceful forest floor after a gentle rain.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Forest Floor Duet 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 Forest Floor Duet.

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

Data visualization

#4F5E4E#8C846C#C2B889#594D3F#A0A994

Palette guide

How to use Forest Floor Duet

Overview

The Forest Floor Duet palette beautifully reflects the subtle, muted tones of a peaceful forest floor after a gentle rain. This collection combines the deep, grounding #594D3F with the organic #4F5E4E, creating a rich, natural base. The unique #8C846C adds a sophisticated olive-tan, while #A0A994 introduces a refreshing muted green. The lightest shade, #C2B889, acts as a soft, warm highlight. Designers and developers can leverage this palette to craft projects that feel authentic, serene, and subtly complex, ideal for evoking a sense of calm and connection to nature without being overly vibrant or stark.

Best used for

  • Artisan coffee packaging
  • Boutique hotel branding
  • Mindfulness and meditation apps
  • Natural skincare product lines
  • Cozy library or bookstore interiors
  • Environmental education platforms

Suggested color roles

primary

#594D3F - A deep, earthy brown, serving as a strong foundation for headers, footers, or primary brand elements, conveying stability.

secondary

#4F5E4E - A muted dark green-brown, excellent for complementary sections, background textures, or secondary navigational elements.

accent

#8C846C - Use this unique muted olive-tan for subtle highlights, interactive elements, or graphic details to add sophisticated interest.

background

#C2B889 - A light, warm beige-moss, providing a soft and inviting canvas that supports darker text beautifully.

text

#594D3F - Ensures strong readability on lighter backgrounds like #C2B889, suitable for body copy and headings.

Accessibility notes

  • Ensure #594D3F text on #C2B889 background meets WCAG AA contrast for good readability.
  • Avoid using #A0A994 for small text on #8C846C as the contrast might be insufficient.
  • For text on darker colors like #594D3F or #4F5E4E, use #C2B889 or a pure white for optimal visibility.
  • Test color combinations under various lighting conditions to ensure readability across devices.

Recommended combinations

Rainy Path

Creates a deep, natural, and sophisticated blend, ideal for immersive backgrounds or premium branding.

#594D3F · #4F5E4E · #8C846C

Mossy Ground

A light and fresh combination for main content areas, offering a serene and readable environment.

#C2B889 · #A0A994 · #4F5E4E

Subtle Harmony

Use a dark base with a refreshing muted green accent, perfect for highlighting key information or navigation.

#594D3F · #A0A994 · #C2B889

CSS variables

:root {
  --forest-floor-duet-1: #4F5E4E;
  --forest-floor-duet-2: #8C846C;
  --forest-floor-duet-3: #C2B889;
  --forest-floor-duet-4: #594D3F;
  --forest-floor-duet-5: #A0A994;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "forest-floor-duet": {
        1: "#4F5E4E",
        2: "#8C846C",
        3: "#C2B889",
        4: "#594D3F",
        5: "#A0A994",
      }
    }
  }
}

Related searches

muted forest color paletteearthy moss wood schemenatural rain inspired colorsserene forest UI designsubtle nature branding

Palette colors

Hex values

Color 1#4F5E4E
·
Color 2#8C846C
·
Color 3#C2B889
·
Color 4#594D3F
·
Color 5#A0A994
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
3.5:1AA18
1.2:1Fail
2.8:1Fail
2
1.9:1Fail
1.9:1Fail
2.2:1Fail
1.5:1Fail
3
3.5:1AA18
1.9:1Fail
4.1:1AA18
1.2:1Fail
4
1.2:1Fail
2.2:1Fail
4.1:1AA18
3.4:1AA18
5
2.8:1Fail
1.5:1Fail
1.2:1Fail
3.4:1AA18

Similar palettes

More like Forest Floor Duet

View all earth