Back to palettes

Palette

Glow Worm

Vivid greens capturing the elusive, pulsating light of glow worms deep within a hidden cavern.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Glow Worm 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 Glow Worm.

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

Data visualization

#9ACD32#ADFF2F#D9FF80#7FFF00#80D200

Palette guide

How to use Glow Worm

Overview

The "Glow Worm" palette is a vibrant collection of energetic greens, perfect for projects seeking a fresh, natural, or digital feel. Dominated by shades like vivid `#7FFF00` and bright `#ADFF2F`, it evokes growth, vitality, and innovation. Designers can leverage its luminous quality to create engaging interfaces or branding that stands out. The lighter `#D9FF80` offers a soft base, while deeper greens like `#9ACD32` and `#80D200` provide grounding and depth. This palette is inherently optimistic and modern, ideal for conveying an eco-conscious or technologically advanced message.

Best used for

  • Eco-friendly branding and packaging
  • Health and wellness applications
  • Gaming interfaces and digital products
  • Outdoor adventure and nature-based marketing
  • Spring/summer fashion collections
  • Educational content for children

Suggested color roles

primary

Use `#7FFF00` for main calls-to-action, key headlines, or primary brand elements to convey energy and freshness.

secondary

Employ `#9ACD32` for supporting sections, subheadings, or secondary interactive elements, offering a more stable green.

accent

Apply `#ADFF2F` for highlights, interactive states, or small, impactful graphical elements, ensuring a luminous pop.

background

Utilize `#D9FF80` as a light, airy background for content areas, providing a soft, refreshing canvas.

text

Pair a dark charcoal or black text (e.g., #333333 or #000000) for optimal readability against lighter greens like `#D9FF80` and `#ADFF2F`.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using lighter greens like `#D9FF80` for backgrounds.
  • Avoid using only green hues to convey meaning (e.g., success/failure) due to color blindness considerations; incorporate symbols or text.
  • Test contrast ratios for text set in `#9ACD32` or `#80D200` against darker backgrounds if not using a black/white default.
  • Be mindful that the brightness of `#7FFF00` and `#ADFF2F` can cause eye strain if used excessively for large text blocks.

Recommended combinations

Fresh UI

A light background with vibrant primary and secondary elements, ideal for digital interfaces.

#D9FF80 · #7FFF00 · #9ACD32

Nature Brand

Combines deeper and brighter greens for an organic, growth-oriented brand identity.

#80D200 · #ADFF2F · #9ACD32

Energetic Accent

Perfect for drawing attention to specific elements or creating dynamic visual highlights.

#ADFF2F · #7FFF00 · #D9FF80

CSS variables

:root {
  --glow-worm-1: #9ACD32;
  --glow-worm-2: #ADFF2F;
  --glow-worm-3: #D9FF80;
  --glow-worm-4: #7FFF00;
  --glow-worm-5: #80D200;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glow-worm": {
        1: "#9ACD32",
        2: "#ADFF2F",
        3: "#D9FF80",
        4: "#7FFF00",
        5: "#80D200",
      }
    }
  }
}

Related searches

vibrant green color palettelime green UI colorsnature inspired digital paletteenergetic branding greensbright eco friendly colors

Palette colors

Hex values

Color 1#9ACD32
·
Color 2#ADFF2F
·
Color 3#D9FF80
·
Color 4#7FFF00
·
Color 5#80D200
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
1.7:1Fail
1.5:1Fail
1:1Fail
2
1.5:1Fail
1.1:1Fail
1.1:1Fail
1.5:1Fail
3
1.7:1Fail
1.1:1Fail
1.1:1Fail
1.7:1Fail
4
1.5:1Fail
1.1:1Fail
1.1:1Fail
1.5:1Fail
5
1:1Fail
1.5:1Fail
1.7:1Fail
1.5:1Fail

Similar palettes

More like Glow Worm

View all vibrant