Jade Jewel

#247e81

Save

About Jade Jewel

I keep seeing Jade Jewel on account pages where the UI needs to feel crisp but not heavy. This one lands in a tighter, cooler teal lane than Bermuda, yet it carries more saturation and clarity than Diver's Eden. It doesn't hover or fade, and it doesn't sink into Emperor Jade's near-black depth. The undertone is distinctly blue, with just enough green to stay fresh, not murky.

On real product screens, it's great for primary buttons and selected tabs in dashboards and finance apps that need to look decisive without turning aggressive. I'd also use it for status accents and metric highlights in healthcare portals and operations tooling, especially when the layout is text-forward and you want the color to read cleanly against white and light grays. Compared to Bermuda's heavier weight, Jade Jewel feels more measured and controlled, like it's confident at a medium volume.

Pair it with soft neutrals and slightly warm grays; cooler palettes can make it feel a touch more severe than you expect.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

Variations

Shades

Darker variations, created by mixing toward black.

Tints

Lighter variations, created by mixing toward white.

Tones

Muted variations, created by reducing saturation.

Hues

Hue rotations around the color wheel.

Temperatures

Warm and cool shifts of this color.

Color harmonies

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Create a gradient with Jade Jewel

Open the generator with this color pre-loaded.

Start creating