Palette

Enchanted Mushroom Glade

Earthy browns, vibrant mossy greens, and a touch of mysterious cream transport you to a magical forest clearing filled with whimsical mushrooms.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Enchanted Mushroom 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 Enchanted Mushroom Glade.

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

Data visualization

#A58B73#6B8E23#3A5A4A#EFEFEF#7A4A3A

Palette guide

How to use Enchanted Mushroom Glade

Overview

The Enchanted Mushroom Glade palette transports you to a magical forest clearing filled with whimsical mushrooms, blending earthy browns, vibrant mossy greens, and a touch of mysterious cream. With a deep forest green #3A5A4A, a lively olive #6B8E23, and a soft, near-white #EFEFEF, this palette is perfect for designers seeking a playful yet natural aesthetic. Developers will find these hex codes ideal for creating engaging game environments, charming illustrations, and unique branding. The warm brown tones like #A58B73 and #7A4A3A ground the palette, while the greens add life and magic, ensuring a versatile and captivating visual experience.

Best used for

Fantasy game art and UI elements
Children's book illustrations
Whimsical branding for artisanal products
Nature-themed educational apps
Blog designs focused on folklore or fantasy
Seasonal marketing materials (autumn/forest themes)

Suggested color roles

primary

#3A5A4A - A deep, muted teal-green, excellent for grounding sections, backgrounds, or large graphical elements, establishing a mysterious forest base.

secondary

#A58B73 - A warm, earthy mushroom brown. Ideal for secondary panels, card backgrounds, or natural texture elements, adding organic depth.

accent

#6B8E23 - A vibrant, lively olive green, reminiscent of fresh moss. Perfect for calls-to-action, interactive elements, or key highlights that need a natural, energetic pop.

background

#EFEFEF - A soft, clean off-white, providing a light, airy canvas that allows the earthy and green tones to truly shine.

text

#7A4A3A - A rich, dark reddish-brown that offers excellent readability against the lighter backgrounds, maintaining the palette's organic and whimsical feel.

Accessibility notes

Ensure #7A4A3A text on #EFEFEF background meets WCAG AAA contrast standards for optimal readability.
Avoid using #A58B73 for small text on #EFEFEF as the contrast may be insufficient.
For interactive elements, ensure the accent color #6B8E23 has enough contrast with its surrounding background.
Consider using a pure black or dark charcoal for critical text if #7A4A3A doesn't meet the highest accessibility requirements for very small font sizes.

Recommended combinations

Forest & Fungus

Deep green background, mushroom brown for content blocks, and light off-white for text, creating a balanced, earthy scene.

#3A5A4A · #A58B73 · #EFEFEF

Mossy Whimsy

Use #EFEFEF as a clean base, #A58B73 for details, and #6B8E23 for playful highlights or illustrations.

#6B8E23 · #A58B73 · #EFEFEF

Glade Contrast

Dark green for dominant elements, dark brown for text, and a vibrant moss green for crucial accents or interactive elements.

#3A5A4A · #7A4A3A · #6B8E23

CSS variables

:root {
  --enchanted-mushroom-glade-1: #A58B73;
  --enchanted-mushroom-glade-2: #6B8E23;
  --enchanted-mushroom-glade-3: #3A5A4A;
  --enchanted-mushroom-glade-4: #EFEFEF;
  --enchanted-mushroom-glade-5: #7A4A3A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "enchanted-mushroom-glade": {
        1: "#A58B73",
        2: "#6B8E23",
        3: "#3A5A4A",
        4: "#EFEFEF",
        5: "#7A4A3A",
      }
    }
  }
}

Hex values

Color 1#A58B73

Color 2#6B8E23

Color 3#3A5A4A

Color 4#EFEFEF

Color 5#7A4A3A

Accessibility

Contrast checker

1.2:1Fail

2.4:1Fail

2.8:1Fail

2.3:1Fail

1.2:1Fail

2:1Fail

3.3:1AA18

1.9:1Fail

2.4:1Fail

2:1Fail

6.7:1AA

1:1Fail