Back to palettes

Palette

Emerald Coast Sparkle

Brilliant greens and aquas, inspired by the lush, jewel-toned waters and vibrant life of an emerald coast.

coolnatural5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Emerald Coast Sparkle 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 Emerald Coast Sparkle.

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

Data visualization

#007A60#00A382#00CCA5#66FFD1#CCFFED

Palette guide

How to use Emerald Coast Sparkle

Overview

The Emerald Coast Sparkle palette bursts with brilliant greens and aquas, inspired by the lush, jewel-toned waters and vibrant life of an emerald coast. It features the deep, rich #007A60, the vivid #00A382, and the dazzling #00CCA5, culminating in the electric #66FFD1 and the ethereal #CCFFED. This palette is exceptionally vibrant and refreshing, perfect for designs that aim to convey energy, freshness, and a connection to pristine natural beauty. It's an excellent choice for travel brands, eco-conscious products, or digital interfaces seeking a clean, invigorating, and modern aesthetic with a cool, sparkling feel.

Best used for

  • Coastal travel and resort branding
  • Eco-friendly product packaging and marketing
  • Outdoor adventure and active lifestyle brands
  • Digital interfaces with a fresh, clean aesthetic
  • Summer fashion and beauty campaigns
  • Nature-themed digital art and illustrations

Suggested color roles

primary

Use #007A60 for dominant elements, headers, or backgrounds to establish depth and a strong, vibrant presence.

secondary

Employ #00A382 or #00CCA5 for supporting graphics, subheadings, or interactive elements, adding dynamism.

accent

Apply #CCFFED for subtle highlights, delicate patterns, or ethereal background accents to introduce lightness and sparkle.

background

Utilize #CCFFED for clean, airy backgrounds that allow the deeper greens to pop, or a crisp white for maximum contrast.

text

For body text, use a dark charcoal. For headlines on lighter backgrounds, #007A60 or #00A382 provides excellent readability. Use white for text on #007A60.

Accessibility notes

  • Ensure #007A60 or #00A382 text on #CCFFED meets WCAG contrast standards.
  • Avoid using #CCFFED for small text on light backgrounds; it's best for large headlines or accents.
  • The lighter greens #66FFD1 and #CCFFED may have low contrast when used together; separate them.
  • Pair #007A60 with #CCFFED for a high-contrast, accessible combination for primary content.

Recommended combinations

Deep Aqua

Ideal for creating an immersive, vibrant feel in branding, website hero sections, or marine-themed illustrations.

#007A60 · #00A382 · #00CCA5

Sparkling Foam

Perfect for light UI elements, background gradients, or decorative patterns that need to convey freshness and shimmer.

#00CCA5 · #66FFD1 · #CCFFED

Vibrant Statement

Use for impactful call-to-action buttons, key highlights, or sections that require a bold yet refreshing visual statement.

#007A60 · #CCFFED · #66FFD1

CSS variables

:root {
  --emerald-coast-sparkle-1: #007A60;
  --emerald-coast-sparkle-2: #00A382;
  --emerald-coast-sparkle-3: #00CCA5;
  --emerald-coast-sparkle-4: #66FFD1;
  --emerald-coast-sparkle-5: #CCFFED;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-coast-sparkle": {
        1: "#007A60",
        2: "#00A382",
        3: "#00CCA5",
        4: "#66FFD1",
        5: "#CCFFED",
      }
    }
  }
}

Related searches

emerald green aqua palettevibrant coastal colorssparkling ocean color schemefresh natural brandingcool green web design

Palette colors

Hex values

Color 1#007A60
·
Color 2#00A382
·
Color 3#00CCA5
·
Color 4#66FFD1
·
Color 5#CCFFED
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.6:1Fail
4.2:1AA18
4.8:1AA
2
1.7:1Fail
1.6:1Fail
2.6:1Fail
2.9:1Fail
3
2.6:1Fail
1.6:1Fail
1.6:1Fail
1.9:1Fail
4
4.2:1AA18
2.6:1Fail
1.6:1Fail
1.1:1Fail
5
4.8:1AA
2.9:1Fail
1.9:1Fail
1.1:1Fail

Similar palettes

More like Emerald Coast Sparkle

View all cool
Deep Sea Coral
Emerald Coastline Bloom
Mystical Aurora Borealis
Rainforest Jewel Canopy
Azure Coast Relic
Azure Coastline