Back to palettes

Palette

Dragonfly Wing Iridescence

Captures the shimmering, ethereal beauty of a dragonfly's wing, shifting with subtle jewel tones.

vibrantelegant5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Dragonfly Wing Iridescence 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 Dragonfly Wing Iridescence.

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

Data visualization

#48D1CC#20B2AA#00CED1#9400D3#008B8B

Palette guide

How to use Dragonfly Wing Iridescence

Overview

The Dragonfly Wing Iridescence palette captures the shimmering, ethereal beauty of a dragonfly's wing, shifting with subtle jewel tones. Featuring vibrant #48D1CC (Medium Turquoise) and the deep, rich #008B8B (Dark Cyan), it offers a sophisticated yet energetic appeal. The striking #9400D3 (Dark Violet) introduces a powerful, unexpected contrast, while #20B2AA (Light Sea Green) and #00CED1 (Dark Turquoise) provide harmonious mid-tones. This palette is perfect for designers and developers seeking to create elegant, bold, and captivating interfaces that evoke magic, nature, and modern luxury, suitable for high-end digital experiences.

Best used for

  • Luxury product websites or apps
  • High-end fashion or beauty branding
  • Artistic portfolio sites
  • Event invitations for sophisticated gatherings
  • Creative tech startup interfaces
  • Digital art and graphic design

Suggested color roles

primary

Establish a vibrant, yet sophisticated foundation with #48D1CC (Medium Turquoise) for main sections, headers, or prominent UI elements.

secondary

Utilize #008B8B (Dark Cyan) for secondary content blocks, navigation bars, or as a strong complementary accent, adding depth.

accent

Draw immediate attention to call-to-action buttons, interactive elements, or key information with #9400D3 (Dark Violet), offering a unique, powerful pop.

background

Apply #20B2AA (Light Sea Green) for lighter content areas, subtle gradients, or as a primary background, creating a refreshing canvas.

text

Pair light text (e.g., white or near-white) against #008B8B or #9400D3 for headings, and a dark charcoal or black for body text on lighter backgrounds.

Accessibility notes

  • Ensure sufficient contrast for #48D1CC text on #20B2AA or #00CED1, as these pairs can be low contrast.
  • White or very light text provides excellent readability on #008B8B and #9400D3.
  • Avoid using #20B2AA text on #00CED1 for critical information due to potential readability issues.
  • For body text, use a dark color (e.g., black or #008B8B) against #48D1CC.

Recommended combinations

Jewel Depths

Ideal for dramatic headers, hero sections, or impactful graphics that demand attention and a luxurious feel.

#008B8B · #9400D3 · #48D1CC

Ethereal Glow

Excellent for light backgrounds, subtle UI accents, or elements conveying delicate shimmer and freshness.

#20B2AA · #00CED1 · #48D1CC

Bold Contrast

Use for prominent call-to-actions, alerts, or interactive components where clear visibility and a unique pop are paramount.

#9400D3 · #48D1CC · #008B8B

CSS variables

:root {
  --dragonfly-wing-iridescence-1: #48D1CC;
  --dragonfly-wing-iridescence-2: #20B2AA;
  --dragonfly-wing-iridescence-3: #00CED1;
  --dragonfly-wing-iridescence-4: #9400D3;
  --dragonfly-wing-iridescence-5: #008B8B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "dragonfly-wing-iridescence": {
        1: "#48D1CC",
        2: "#20B2AA",
        3: "#00CED1",
        4: "#9400D3",
        5: "#008B8B",
      }
    }
  }
}

Related searches

teal violet jewel palettedragonfly ethereal colorsbold iridescent designluxury UI color schemegemstone web design

Palette colors

Hex values

Color 1#48D1CC
·
Color 2#20B2AA
·
Color 3#00CED1
·
Color 4#9400D3
·
Color 5#008B8B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1:1Fail
3.5:1AA18
2.2:1Fail
2
1.4:1Fail
1.3:1Fail
2.5:1Fail
1.6:1Fail
3
1:1Fail
1.3:1Fail
3.4:1AA18
2.1:1Fail
4
3.5:1AA18
2.5:1Fail
3.4:1AA18
1.6:1Fail
5
2.2:1Fail
1.6:1Fail
2.1:1Fail
1.6:1Fail

Similar palettes

More like Dragonfly Wing Iridescence

View all vibrant
Jewel Box Enchantment
Jewel Box Gems
Regal Gold Sapphire
Ruby Gemstone Gleam
Ruby Gemstone Gleam
Velvet Plum Nectar