Back to palettes

Palette

Emerald Gemstone Luster

Luxurious greens and teals, gleaming with the depth and brilliance of polished gemstones.

coolelegant5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Emerald Gemstone Luster 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 Emerald Gemstone Luster.

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

Data visualization

#2E8B57#3CB371#66CDAA#20B2AA#48D1CC

Palette guide

How to use Emerald Gemstone Luster

Overview

The Emerald Gemstone Luster palette offers a luxurious array of cool greens and vibrant teals, perfect for designs requiring elegance and depth. Featuring a deep emerald like #2E8B57 alongside a brighter jade #3CB371, and transitioning into refreshing teals such as #20B2AA and #48D1CC, this collection evokes the brilliance of polished precious stones. Designers can leverage these hues to create sophisticated digital interfaces, upscale brand identities, or serene natural-themed visuals. The inclusion of a lighter mint tone like #66CDAA provides versatility for subtle accents or softer backgrounds, ensuring a balanced and visually rich experience. This palette is ideal for conveying luxury, tranquility, and natural beauty with a refined touch.

Best used for

  • Luxury brand identity
  • High-end jewelry websites
  • Spa and wellness marketing materials
  • Nature-inspired UI/UX designs
  • Elegant event invitations
  • Sustainable fashion branding

Suggested color roles

primary

Use #2E8B57 as a deep, stable base for branding, main UI elements, or important headings.

secondary

Employ #3CB371 as a brighter, supportive green for interactive elements, subheadings, or secondary graphics.

accent

Apply #48D1CC as a vibrant, eye-catching highlight for calls-to-action, alerts, or key features.

background

Utilize #66CDAA as a light, airy background to provide a clean canvas for content and promote tranquility.

text

Pair #2E8B57 with light backgrounds for strong readability, or use white text on darker palette colors.

Accessibility notes

  • Ensure sufficient contrast when using #66CDAA with lighter text; consider darker text for readability.
  • Pair #2E8B57 or #20B2AA with white or light gray text for optimal legibility on dark backgrounds.
  • Avoid using #3CB371 directly on #66CDAA for small text due to potential low contrast; check WCAG AA.
  • Thoroughly test all text and background combinations to meet WCAG AA contrast standards.

Recommended combinations

Elegant Header

For striking main titles with a bright accent and a soft, clean background.

#2E8B57 · #48D1CC · #66CDAA

Natural UI Elements

Ideal for interactive buttons, icons, and progress bars in nature-themed applications.

#3CB371 · #20B2AA · #2E8B57

Lush Branding

Creates a sophisticated, fresh look for brand logos and primary marketing graphics.

#2E8B57 · #3CB371 · #66CDAA

CSS variables

:root {
  --emerald-gemstone-luster-1: #2E8B57;
  --emerald-gemstone-luster-2: #3CB371;
  --emerald-gemstone-luster-3: #66CDAA;
  --emerald-gemstone-luster-4: #20B2AA;
  --emerald-gemstone-luster-5: #48D1CC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-gemstone-luster": {
        1: "#2E8B57",
        2: "#3CB371",
        3: "#66CDAA",
        4: "#20B2AA",
        5: "#48D1CC",
      }
    }
  }
}

Related searches

emerald green color palettejewel tone design inspirationluxury green teal colorssophisticated nature palettegemstone website colors

Palette colors

Hex values

Color 1#2E8B57
·
Color 2#3CB371
·
Color 3#66CDAA
·
Color 4#20B2AA
·
Color 5#48D1CC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.2:1Fail
1.6:1Fail
2.3:1Fail
2
1.6:1Fail
1.4:1Fail
1:1Fail
1.4:1Fail
3
2.2:1Fail
1.4:1Fail
1.4:1Fail
1:1Fail
4
1.6:1Fail
1:1Fail
1.4:1Fail
1.4:1Fail
5
2.3:1Fail
1.4:1Fail
1:1Fail
1.4:1Fail

Similar palettes

More like Emerald Gemstone Luster

View all cool
Precious Jade Stream
Regal Emerald Court
Azure Sapphire Gleam
Emerald Grotto Depths
Emerald Grotto Shimmer
Imperial Jade Splendor