Palette

Rainforest Emerald Gem

A lush, vibrant gradient of emerald greens, mimicking the dense, sparkling foliage of a hidden rainforest.

MonochromeNatural5 colors

More Monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Rainforest Emerald Gem 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 Rainforest Emerald Gem.

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

Data visualization

#004B49#006B6B#008B8B#00A19D#00BFBF

Palette guide

How to use Rainforest Emerald Gem

Overview

The "Rainforest Emerald Gem" palette showcases a stunning gradient of rich, jewel-toned emeralds and teals, evoking the sparkling depths of a hidden rainforest. Ranging from the deep, mysterious #004B49 to the bright, effervescent #00BFBF, this monochrome-inspired collection is perfect for designs demanding sophistication, luxury, and a connection to natural beauty. Hex codes like #006B6B and #00A19D offer versatile mid-tones, allowing designers to create elegant, cohesive interfaces or branding that feels both refined and organically vibrant, suitable for high-end digital and print applications.

Best used for

Luxury jewelry branding
High-end spa and wellness centers
Sophisticated tech interfaces
Coastal resort marketing
Environmental luxury products
Modern art and design portfolios

Suggested color roles

primary

Use #004B49 as a deep, authoritative base for major elements, brand identity, and impactful headlines.

secondary

Apply #006B6B for supporting information, navigation, and subheadings, maintaining a cohesive flow.

accent

Utilize #00BFBF as a bright, eye-catching highlight for calls-to-action, interactive elements, or key visual details.

background

For a vibrant dark theme, consider #00A19D as a background. For content, pair with a neutral light gray or off-white.

text

On dark backgrounds, white or a very light gray ensures readability. For light backgrounds, #004B49 provides excellent contrast.

Accessibility notes

Ensure sufficient contrast between lighter shades like #00BFBF and #00A19D when used for text on backgrounds.
Darker shades such as #004B49 offer excellent contrast for white text, suitable for headlines.
Avoid using mid-tones like #008B8B for small text unless on a significantly contrasting background.
Always test text and interactive elements against WCAG AA standards across the entire palette.

Recommended combinations

Deep Jewel

A rich, dark base with a vibrant accent and a balanced secondary for depth and visual interest.

#004B49 · #00BFBF · #006B6B

Sparkling Edge

Mid-tone base with a bright, sparkling highlight, grounded by the deepest shade for contrast.

#008B8B · #00BFBF · #004B49

Monochrome Flow

Smooth transition of cool tones for a sophisticated, flowing design in backgrounds or graphic elements.

#006B6B · #00A19D · #004B49

CSS variables

:root {
  --rainforest-emerald-gem-1: #004B49;
  --rainforest-emerald-gem-2: #006B6B;
  --rainforest-emerald-gem-3: #008B8B;
  --rainforest-emerald-gem-4: #00A19D;
  --rainforest-emerald-gem-5: #00BFBF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "rainforest-emerald-gem": {
        1: "#004B49",
        2: "#006B6B",
        3: "#008B8B",
        4: "#00A19D",
        5: "#00BFBF",
      }
    }
  }
}

Hex values

Color 1#004B49

Color 2#006B6B

Color 3#008B8B

Color 4#00A19D

Color 5#00BFBF

Accessibility

Contrast checker

1.6:1Fail

2.4:1Fail

3.1:1AA18

4.4:1AA18

1.6:1Fail

1.5:1Fail

2:1Fail

2.8:1Fail

2.4:1Fail

1.5:1Fail

1.3:1Fail

1.8:1Fail

3.1:1AA18

2:1Fail

1.3:1Fail

1.4:1Fail

4.4:1AA18

2.8:1Fail

1.8:1Fail

1.4:1Fail

Similar palettes

More like Rainforest Emerald Gem

View all Monochrome

Rainforest Canopy Light

Ancient Forest Roots

Botanical Forest Gleam

Botanical Sketch Book

Deep Moss Canopy

Deep Woods