Back to palettes

Palette

Dragon Scales

Lustrous greens, from deep forest to vibrant lime, mimic the majestic, interlocking scales of a mythical dragon.

earthelegant5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#006400#008000#2E8B57#4CAF50#8BC34A

Palette guide

How to use Dragon Scales

Overview

The Dragon Scales palette presents a majestic array of lustrous greens, from deep forest to vibrant lime, mimicking the interlocking scales of a mythical dragon. With foundational shades like #006400 (Dark Green) and #008000 (Green), it establishes a strong, earthy base. The energetic #2E8B57 (Sea Green) and refreshing #4CAF50 (Lime Green) introduce brighter, more dynamic elements, while #8BC34A (Light Green) offers a soft, natural highlight. This palette is exceptionally versatile for designers and developers seeking to create natural, elegant, or fantasy-themed interfaces, offering a sense of growth, stability, and mythical beauty.

Best used for

  • Eco-friendly brand websites or apps
  • Nature conservation digital platforms
  • Fantasy RPG game environments or UI
  • Organic food product packaging
  • Educational content about nature or mythology
  • Outdoor adventure equipment branding

Suggested color roles

primary

Use #006400 (Dark Green) as a grounding color for main sections, strong headers, or robust UI elements.

secondary

Apply #2E8B57 (Sea Green) for secondary content areas, navigation, or as a complementary background, offering vibrancy.

accent

Highlight interactive elements, call-to-action buttons, or key information with #4CAF50 (Lime Green), providing a fresh, energetic pop.

background

Utilize #008000 (Green) for deeper background sections or large panels, creating a rich, immersive canvas.

text

Pair light text (e.g., white or near-white) against #006400 or #008000 for headlines, and a dark charcoal for body text on #8BC34A or #4CAF50.

Accessibility notes

  • Ensure sufficient contrast when using #8BC34A text on #4CAF50 or #2E8B57, as these pairs might have low contrast.
  • White or very light text provides excellent readability on #006400 and #008000.
  • Avoid using #2E8B57 text on #4CAF50 for critical information due to potential readability issues.
  • For body text, use a dark color (e.g., black or #006400) against #8BC34A.

Recommended combinations

Deep Forest

Ideal for robust headers, background sections, or elements requiring a strong, natural presence.

#006400 · #008000 · #2E8B57

Vibrant Growth

Excellent for lighter content areas, interactive elements, or illustrations, conveying freshness and energy.

#4CAF50 · #8BC34A · #2E8B57

Mythic Accent

Use for prominent call-to-actions, alerts, or key visual elements that need to stand out with a natural flair.

#008000 · #4CAF50 · #006400

CSS variables

:root {
  --dragon-scales-1: #006400;
  --dragon-scales-2: #008000;
  --dragon-scales-3: #2E8B57;
  --dragon-scales-4: #4CAF50;
  --dragon-scales-5: #8BC34A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "dragon-scales": {
        1: "#006400",
        2: "#008000",
        3: "#2E8B57",
        4: "#4CAF50",
        5: "#8BC34A",
      }
    }
  }
}

Related searches

green dragon color paletteforest green web designnature inspired ui colorsemerald lime green schememythology branding colors

Palette colors

Hex values

Color 1#006400
·
Color 2#008000
·
Color 3#2E8B57
·
Color 4#4CAF50
·
Color 5#8BC34A
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.8:1Fail
2.7:1Fail
3.5:1AA18
2
1.4:1Fail
1.2:1Fail
1.8:1Fail
2.4:1Fail
3
1.8:1Fail
1.2:1Fail
1.5:1Fail
2:1Fail
4
2.7:1Fail
1.8:1Fail
1.5:1Fail
1.3:1Fail
5
3.5:1AA18
2.4:1Fail
2:1Fail
1.3:1Fail

Similar palettes

More like Dragon Scales

View all earth