Palette

Deep Jade Serenity

A harmonious blend of deep greens, from dark forest to lush jade, symbolizing serenity and nature.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2F4F4F#3CB371#228B22#6B8E23#006400

Palette guide

How to use Deep Jade Serenity

Overview

The Deep Jade Serenity palette offers a rich, harmonious spectrum of deep greens, perfect for evoking a sense of calm, nature, and sophistication. Anchored by the profound Dark Green (#006400) and the muted Dark Slate Gray (#2F4F4F), this palette is beautifully complemented by the vibrant Medium Sea Green (#3CB371), the classic Forest Green (#228B22), and the earthy Olive Drab (#6B8E23). Designers and developers can leverage this collection to create immersive digital experiences or tangible products that resonate with tranquility and organic elegance. Its versatility makes it ideal for projects requiring a connection to the environment or a sophisticated, understated aesthetic.

Best used for

Eco-friendly product branding
Wellness and meditation app interfaces
Nature-themed websites and blogs
Sustainable fashion design
Outdoor adventure marketing materials
Interior design mood boards for calming spaces

Suggested color roles

primary

Use #006400 (Dark Green) as the foundational color for prominent branding elements, headers, and strong calls-to-action, providing a deep, anchoring presence.

secondary

Apply #2F4F4F (Dark Slate Gray) for subheadings, secondary navigation, or as a sophisticated background for content blocks, offering a refined contrast.

accent

Incorporate #3CB371 (Medium Sea Green) for interactive elements, highlights, or icons where a vibrant yet natural pop of color is desired to draw attention.

background

Employ #6B8E23 (Olive Drab) for subtle, textured backgrounds or large graphic elements to infuse an earthy, calming atmosphere without being too dark.

text

For optimal readability against darker palette colors like #006400 or #2F4F4F, use pure white (#FFFFFF) or a very light gray. For text on lighter backgrounds such as #6B8E23, consider using #006400 or a standard charcoal.

Accessibility notes

Ensure sufficient contrast when pairing #3CB371 with lighter backgrounds or other greens like #6B8E23 for text or important UI elements (WCAG AA minimum).
White text on #006400 and #2F4F4F typically offers excellent contrast, often meeting WCAG AAA standards for large text.
Avoid using #6B8E23 and #228B22 together for small text or critical information as their similar value might lead to low contrast.
Always test text readability, especially for smaller font sizes, using a contrast checker to guarantee compliance across all color combinations.

Recommended combinations

Forest Depths

Ideal for core branding, hero sections, and primary calls-to-action to establish a strong, natural, and trustworthy presence.

#006400 · #2F4F4F · #3CB371

Earthy Undergrowth

Excellent for secondary content blocks, subtle backgrounds, and illustrative elements, providing a grounded and organic feel.

#6B8E23 · #228B22 · #2F4F4F

Verdant Accents

Perfect for UI elements, interactive components, and highlights where a pop of fresh, vibrant green is desired against deeper, more subdued tones.

#2F4F4F · #3CB371 · #006400

CSS variables

:root {
  --deep-jade-serenity-1: #2F4F4F;
  --deep-jade-serenity-2: #3CB371;
  --deep-jade-serenity-3: #228B22;
  --deep-jade-serenity-4: #6B8E23;
  --deep-jade-serenity-5: #006400;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-jade-serenity": {
        1: "#2F4F4F",
        2: "#3CB371",
        3: "#228B22",
        4: "#6B8E23",
        5: "#006400",
      }
    }
  }
}

Hex values

Color 1#2F4F4F

Color 2#3CB371

Color 3#228B22

Color 4#6B8E23

Color 5#006400

Accessibility

Contrast checker

3.3:1AA18

2:1Fail

2.3:1Fail

1.2:1Fail

3.3:1AA18

1.6:1Fail

1.4:1Fail

2.8:1Fail

2:1Fail

1.6:1Fail

1.2:1Fail

1.7:1Fail

2.3:1Fail

1.4:1Fail

1.2:1Fail

2:1Fail

1.2:1Fail

2.8:1Fail

1.7:1Fail

2:1Fail

Similar palettes

More like Deep Jade Serenity

Deep Jade Serenity

See it in context.

Ready when you are.

Built with Deep Jade Serenity.

How to use Deep Jade Serenity

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Forest Depths

Earthy Undergrowth

Verdant Accents

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Deep Jade Serenity