Palette

Jade Mountain Sanctuary

Deep to light greens evoke the tranquil serenity of a lush jade mountain sanctuary.

EarthCalm5 colors

More Earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Jade Mountain Sanctuary 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 Jade Mountain Sanctuary.

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

Data visualization

#004D40#1B5E20#2E7D32#4CAF50#8BC34A

Palette guide

How to use Jade Mountain Sanctuary

Overview

The Jade Mountain Sanctuary palette captures the tranquil serenity of a lush jade mountain sanctuary, moving from deep to lively greens. Featuring robust hex codes like `#004D40` and the vibrant `#8BC34A`, this palette is ideal for projects seeking to convey natural health, growth, and peaceful energy. Designers can leverage `#2E7D32` as a balanced primary hue, while `#1B5E20` provides a solid secondary and `#4CAF50` offers a versatile mid-tone. This collection ensures a dynamic yet harmonious visual experience, promoting feelings of vitality and connection to the earth, suitable for diverse applications.

Best used for

Health and wellness product branding
Gardening and landscaping services websites
Environmental organizations and initiatives
Fresh food and organic produce packaging
Outdoor lifestyle and adventure content
Sustainable fashion and eco-friendly designs

Suggested color roles

primary

Use `#2E7D32` for main headings, call-to-action buttons, and key interactive elements. It's vibrant and inviting.

secondary

Apply `#004D40` for navigation, footers, or as a strong background to ground the design and ensure readability.

accent

Reserve `#8BC34A` for subtle highlights, icons, or graphical elements that need a fresh, energetic pop.

background

Employ `#4CAF50` for primary content areas, offering a lively, inviting, and refreshing backdrop.

text

Utilize `#004D40` for all body text to ensure maximum readability and a cohesive, natural aesthetic.

Accessibility notes

Ensure `#004D40` provides sufficient contrast against lighter shades like `#4CAF50` and `#8BC34A` for text.
Avoid using `#8BC34A` for extensive body text as its brightness can strain eyes.
When pairing lighter greens, verify their contrast ratio meets WCAG standards, especially for interactive elements.
White text on `#004D40` or `#1B5E20` offers excellent readability and a crisp, clean appearance.

Recommended combinations

Deep Forest

Creates a strong, layered foundation, perfect for establishing a sense of depth and natural authority.

#004D40 · #1B5E20 · #2E7D32

Lively Growth

Offers a bright, energetic progression, ideal for highlighting growth, vitality, or progressive steps.

#2E7D32 · #4CAF50 · #8BC34A

Nature's Balance

Combines deep grounding with vibrant freshness, suitable for compelling visual narratives or feature sections.

#004D40 · #4CAF50 · #8BC34A

CSS variables

:root {
  --jade-mountain-sanctuary-3-1: #004D40;
  --jade-mountain-sanctuary-3-2: #1B5E20;
  --jade-mountain-sanctuary-3-3: #2E7D32;
  --jade-mountain-sanctuary-3-4: #4CAF50;
  --jade-mountain-sanctuary-3-5: #8BC34A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jade-mountain-sanctuary-3": {
        1: "#004D40",
        2: "#1B5E20",
        3: "#2E7D32",
        4: "#4CAF50",
        5: "#8BC34A",
      }
    }
  }
}

Hex values

Color 1#004D40

Color 2#1B5E20

Color 3#2E7D32

Color 4#4CAF50

Color 5#8BC34A

Accessibility

Contrast checker

1.2:1Fail

1.9:1Fail

3.5:1AA18

4.7:1AA

1.2:1Fail

1.5:1Fail

2.8:1Fail

3.7:1AA18

1.9:1Fail

1.5:1Fail

1.8:1Fail

2.4:1Fail

3.5:1AA18

2.8:1Fail

1.8:1Fail

1.3:1Fail

4.7:1AA

3.7:1AA18

2.4:1Fail

1.3:1Fail

Similar palettes

More like Jade Mountain Sanctuary