Back to palettes

Palette

Tropical Rainforest Floor

Deep greens and browns, capturing the lush, damp, and earthy environment of a rainforest undergrowth.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Tropical Rainforest Floor 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 Tropical Rainforest Floor.

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

Data visualization

#228B22#3CB371#6B8E23#8B4513#556B2F

Palette guide

How to use Tropical Rainforest Floor

Overview

The Tropical Rainforest Floor palette captures the lush, damp, and earthy environment of a rainforest undergrowth. It features deep, robust greens like #228B22 (Forest Green) and #3CB371 (Medium Sea Green), complemented by earthy olive #6B8E23 (Olive Drab), rich brown #8B4513 (Saddle Brown), and a muted dark olive #556B2F (Dark Olive Green). This palette is perfect for designs that aim to evoke a sense of natural authenticity, grounding, and organic beauty. Designers can use these hues for outdoor brands, ecological projects, or rustic-chic aesthetics. Developers will find these hex codes useful for creating visually consistent and inviting experiences that resonate with an earthy, natural appeal.

Best used for

  • Outdoor adventure and gear brands
  • Eco-tourism and travel agencies
  • Organic and natural food products
  • Gardening and landscape design services
  • Rustic home decor and furniture
  • Environmental education platforms

Suggested color roles

primary

Use #228B22 as a strong, grounding primary color for headers or main content areas, conveying stability.

secondary

Employ #8B4513 for subheadings or important accents, adding an earthy, warm contrast.

accent

Introduce #3CB371 for subtle highlights, icons, or interactive elements, providing a fresh touch.

background

Apply #556B2F as a deep, natural background color for sections, enhancing the organic feel.

text

For body text, a light cream or off-white offers excellent readability against #228B22, #8B4513, and #556B2F.

Accessibility notes

  • Ensure sufficient contrast between lighter greens like #3CB371 and darker browns or greens.
  • Verify readability of white or light cream text on #228B22, #8B4513, and #556B2F.
  • Avoid using #6B8E23 text on #3CB371 due to potential low contrast.
  • Prioritize light-colored text for optimal readability on all dark and medium-toned colors in this palette.

Recommended combinations

Earthy Depths

Excellent for creating a rich, grounded aesthetic in branding or website footers.

#228B22 · #8B4513 · #556B2F

Mossy Path

Ideal for natural illustrations or content blocks, showcasing a harmonious green gradient.

#3CB371 · #6B8E23 · #228B22

Undergrowth

Use for rustic designs or product packaging, where brown provides a warm, authentic base.

#8B4513 · #556B2F · #3CB371

CSS variables

:root {
  --tropical-rainforest-floor-1: #228B22;
  --tropical-rainforest-floor-2: #3CB371;
  --tropical-rainforest-floor-3: #6B8E23;
  --tropical-rainforest-floor-4: #8B4513;
  --tropical-rainforest-floor-5: #556B2F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "tropical-rainforest-floor": {
        1: "#228B22",
        2: "#3CB371",
        3: "#6B8E23",
        4: "#8B4513",
        5: "#556B2F",
      }
    }
  }
}

Related searches

rainforest floor colorsearthy jungle palettedeep green brown schemenatural organic designmossy forest colors

Palette colors

Hex values

Color 1#228B22
·
Color 2#3CB371
·
Color 3#6B8E23
·
Color 4#8B4513
·
Color 5#556B2F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
1.2:1Fail
1.6:1Fail
1.4:1Fail
2
1.6:1Fail
1.4:1Fail
2.7:1Fail
2.2:1Fail
3
1.2:1Fail
1.4:1Fail
1.9:1Fail
1.6:1Fail
4
1.6:1Fail
2.7:1Fail
1.9:1Fail
1.2:1Fail
5
1.4:1Fail
2.2:1Fail
1.6:1Fail
1.2:1Fail

Similar palettes

More like Tropical Rainforest Floor

View all earth