Back to palettes

Palette

Jade Dragon Scale

Deep, lustrous greens and teals inspired by ancient jade and mythical creatures.

vibrantelegant5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Jade Dragon Scale 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 Dragon Scale.

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

Data visualization

#007070#00A693#4FD1C5#88EADF#004D4D

Palette guide

How to use Jade Dragon Scale

Overview

The Jade Dragon Scale palette unleashes a captivating array of deep, lustrous greens and teals, inspired by ancient jade and mythical elegance. Ranging from the profound #004D4D to the bright #88EADF, this palette includes the rich #007070, the vibrant #00A693, and the striking #4FD1C5. Designers and developers will find these hues perfect for crafting exotic, sophisticated, and memorable digital products or branding. The palette's depth and luminosity make it ideal for projects that aim to convey strength, mystery, and a touch of the fantastical, from luxury lifestyle brands to intricate UI designs.

Best used for

  • Exotic luxury brand identity
  • Gaming UI/UX design
  • Fantasy novel cover art
  • High-tech product showcases
  • Vibrant event branding
  • Digital art and illustration

Suggested color roles

primary

Use #00A693 for main interactive elements or brand accents, offering a vibrant and engaging presence.

secondary

Apply #007070 for supporting content or secondary buttons, providing depth and stability.

accent

Employ #4FD1C5 for eye-catching highlights or calls-to-action, adding a luminous, modern touch.

background

A dark background like #004D4D provides a dramatic base, making lighter colors pop, or use a crisp white for contrast.

text

For body text, a bright white or very light grey is recommended when using dark backgrounds like #004D4D.

Accessibility notes

  • When using #004D4D as a background, ensure text in #88EADF or white has sufficient contrast (WCAG AA).
  • Verify that interactive elements using #00A693 or #4FD1C5 have clear focus states.
  • Avoid using #88EADF for small text unless on a very dark background due to its lightness.
  • Consider a slightly off-white for text on dark backgrounds to reduce eye strain.

Recommended combinations

Mystic Depths

Ideal for creating deep, mysterious backgrounds with elegant overlays in web design.

#004D4D · #007070 · #00A693

Dragon's Spark

Excellent for UI elements, bringing a vibrant, luminous feel to interactive components.

#4FD1C5 · #88EADF · #007070

Teal Elegance

Effective for bold headings and subheadings, creating a sophisticated and exotic look.

#00A693 · #004D4D · #4FD1C5

CSS variables

:root {
  --jade-dragon-scale-1: #007070;
  --jade-dragon-scale-2: #00A693;
  --jade-dragon-scale-3: #4FD1C5;
  --jade-dragon-scale-4: #88EADF;
  --jade-dragon-scale-5: #004D4D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jade-dragon-scale": {
        1: "#007070",
        2: "#00A693",
        3: "#4FD1C5",
        4: "#88EADF",
        5: "#004D4D",
      }
    }
  }
}

Related searches

exotic teal green palettedragon scale color schemevibrant jade designmystical green colorsluxury teal branding

Palette colors

Hex values

Color 1#007070
·
Color 2#00A693
·
Color 3#4FD1C5
·
Color 4#88EADF
·
Color 5#004D4D
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
3.2:1AA18
4.2:1AA18
1.6:1Fail
2
1.9:1Fail
1.6:1Fail
2.2:1Fail
3.2:1AA18
3
3.2:1AA18
1.6:1Fail
1.3:1Fail
5.2:1AA
4
4.2:1AA18
2.2:1Fail
1.3:1Fail
6.9:1AA
5
1.6:1Fail
3.2:1AA18
5.2:1AA
6.9:1AA

Similar palettes

More like Jade Dragon Scale

View all vibrant