Back to palettes

Palette

Emerald Coast Dive

Diving into vibrant teal and turquoise, from deep ocean currents to shimmering coastlines.

coolenergetic5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#005F6B#00838F#00BCD4#5ED3E0#AFEBEF

Palette guide

How to use Emerald Coast Dive

Overview

The Emerald Coast Dive palette (ID: emerald-coast-dive-2) plunges into a refreshing spectrum of vibrant teal and turquoise, mimicking the depths and shimmering surface of the ocean. It features the deep #005F6B, the rich #00838F, and the bright #00BCD4, transitioning to the lively #5ED3E0 and ethereal #AFEBEF. This palette is highly energetic and evocative, perfect for designs that aim to convey freshness, dynamism, and a connection to water or marine themes. It's an excellent choice for travel brands, environmental initiatives, or digital interfaces seeking a clean, invigorating, and modern aesthetic with a cool, vibrant feel.

Best used for

  • Travel and tourism branding (coastal/beach themes)
  • Eco-friendly product packaging and websites
  • Marine conservation organizations
  • Sports and active lifestyle brands
  • Digital interfaces with a clean, refreshing feel
  • Summer event promotions and decor

Suggested color roles

primary

Use #005F6B for dominant elements, headers, or backgrounds to establish depth and a strong oceanic presence.

secondary

Employ #00838F or #00BCD4 for supporting graphics, subheadings, or interactive elements, adding vibrancy.

accent

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

background

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

text

For body text, use a dark charcoal. For headlines on lighter backgrounds, #005F6B or #00838F provides excellent readability. Use white for text on #005F6B.

Accessibility notes

  • Ensure #005F6B or #00838F text on #AFEBEF meets WCAG contrast standards.
  • Avoid using #AFEBEF for small text on light backgrounds; it's best for large headlines or accents.
  • The lighter teals, #5ED3E0 and #AFEBEF, may have low contrast when used together.
  • Pair #005F6B with #AFEBEF for strong, accessible contrast in key design areas.

Recommended combinations

Oceanic Depth

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

#005F6B · #00838F · #00BCD4

Coastal Shimmer

Perfect for vibrant UI elements, background gradients, or decorative patterns that need to convey lightness and movement.

#00BCD4 · #5ED3E0 · #AFEBEF

Dynamic Contrast

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

#005F6B · #AFEBEF · #00BCD4

CSS variables

:root {
  --emerald-coast-dive-2-1: #005F6B;
  --emerald-coast-dive-2-2: #00838F;
  --emerald-coast-dive-2-3: #00BCD4;
  --emerald-coast-dive-2-4: #5ED3E0;
  --emerald-coast-dive-2-5: #AFEBEF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-coast-dive-2": {
        1: "#005F6B",
        2: "#00838F",
        3: "#00BCD4",
        4: "#5ED3E0",
        5: "#AFEBEF",
      }
    }
  }
}

Related searches

emerald teal ocean palettevibrant turquoise colorscoastal dive color schemerefreshing marine brandingaquatic web design colors

Palette colors

Hex values

Color 1#005F6B
·
Color 2#00838F
·
Color 3#00BCD4
·
Color 4#5ED3E0
·
Color 5#AFEBEF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
3.2:1AA18
4.2:1AA18
5.6:1AA
2
1.6:1Fail
2:1Fail
2.6:1Fail
3.4:1AA18
3
3.2:1AA18
2:1Fail
1.3:1Fail
1.7:1Fail
4
4.2:1AA18
2.6:1Fail
1.3:1Fail
1.3:1Fail
5
5.6:1AA
3.4:1AA18
1.7:1Fail
1.3:1Fail

Similar palettes

More like Emerald Coast Dive

View all cool
Aqua Marine Sparkle
Jade Jewel City
Teal Wave Current
Abstract Ocean Currents
Aegean Blue Depths
Aqua Ocean Shimmer