Palette

Jade Garden Serenity

A tranquil blend of deep greens, evoking a serene, ancient jade garden, peaceful and balanced.

earthcalm5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Jade Garden Serenity 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 Garden Serenity.

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

Data visualization

#36453B#50C878#00A86B#008080#2F4F4F

Palette guide

How to use Jade Garden Serenity

Overview

The Jade Garden Serenity palette offers a tranquil blend of deep greens and a striking teal, evoking a serene, ancient jade garden that is peaceful and balanced. It grounds itself with the rich, almost black-green of #36453B and the sophisticated #2F4F4F (Dark Slate Gray). The palette introduces vibrant life with the lush #50C878 and the deep, true jade of #00A86B, while #008080 (Teal) adds an unexpected touch of cool, watery depth. This collection is ideal for designs seeking a harmonious, elegant, and calming atmosphere with a touch of oriental mystique.

Best used for

Asian-inspired spa or wellness branding
Botanical garden websites
Luxury tea or natural product packaging
Interior design for tranquil spaces
Meditation apps or mindfulness content
Cultural event promotion

Suggested color roles

primary

A very deep, almost charcoal green (#36453B), ideal for strong foundational elements, main headings, or a sophisticated brand base.

secondary

A dark slate gray with green undertones (#2F4F4F), perfect for subheadings, navigation, or complementary structural components.

accent

A vibrant, refreshing jade green (#50C878) that brings energy and highlights interactive elements or key visual details.

background

A rich, balanced jade green (#00A86B) that can serve as an immersive background, especially when paired with lighter text.

text

Use #36453B or #2F4F4F for body text on light backgrounds (if applicable). Consider a bright near-white or #50C878 for text on darker backgrounds.

Accessibility notes

For text on #36453B, #2F4F4F, or #00A86B, ensure sufficient contrast by using #50C878 or a very light color.
#008080 (Teal) can be used for text on lighter backgrounds but check contrast carefully.
Avoid using #50C878 as text on #00A86B or #008080 if contrast is insufficient for small sizes.
Always test contrast ratios across all elements to ensure readability.

Recommended combinations

Garden Depth

Creates a sophisticated, grounded feel with a refreshing accent, great for luxury branding.

#36453B · #2F4F4F · #50C878

Tranquil Waters

Evokes a serene, watery ambiance, suitable for spa themes or calm digital interfaces.

#00A86B · #008080 · #36453B

Jade Harmony

A harmonious blend of vibrant and deep greens, perfect for captivating illustrations or content blocks.

#50C878 · #00A86B · #2F4F4F

CSS variables

:root {
  --jade-garden-serenity-1: #36453B;
  --jade-garden-serenity-2: #50C878;
  --jade-garden-serenity-3: #00A86B;
  --jade-garden-serenity-4: #008080;
  --jade-garden-serenity-5: #2F4F4F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jade-garden-serenity": {
        1: "#36453B",
        2: "#50C878",
        3: "#00A86B",
        4: "#008080",
        5: "#2F4F4F",
      }
    }
  }
}

Hex values

Color 1#36453B

Color 2#50C878

Color 3#00A86B

Color 4#008080

Color 5#2F4F4F

Accessibility

Contrast checker

4.8:1AA

3.3:1AA18

2.1:1Fail

1.1:1Fail

4.8:1AA

1.4:1Fail

2.2:1Fail

4.2:1AA18

3.3:1AA18

1.4:1Fail

1.5:1Fail

2.9:1Fail

2.1:1Fail

2.2:1Fail

1.5:1Fail

1.9:1Fail

1.1:1Fail

4.2:1AA18

2.9:1Fail

1.9:1Fail

Similar palettes

More like Jade Garden Serenity

View all earth

Bamboo Forest Calm

Enchanted Garden Gate