Palette

Emerald Lagoon Depths

Dive into a tropical lagoon with these deep and refreshing aqua and teal shades, evoking clear, cool waters.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Emerald Lagoon Depths 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 Lagoon Depths.

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

Data visualization

#008080#00A0A0#006060#004040#00BFBF

Palette guide

How to use Emerald Lagoon Depths

Overview

The Emerald Lagoon Depths palette invites a dive into a tropical haven with its deep and refreshing aqua and teal shades, evoking clear, cool waters. Featuring a vibrant #008080 and #00A0A0, it is grounded by the profound #006060 and #004040, while #00BFBF offers a brilliant, shimmering highlight. This collection is perfect for designs seeking to convey tranquility, tropical luxury, and refreshing clarity. Ideal for travel brands, spa services, or any digital interface that benefits from a clean, cool, and immersive aesthetic. The subtle variations within the teal spectrum allow for dynamic visual layering, creating depth and a captivating user experience.

Best used for

Tropical travel agencies
Luxury spa and wellness resorts
Aquatic sports branding
Ocean conservation initiatives
Modern, clean tech interfaces
Summer fashion and lifestyle blogs

Suggested color roles

primary

Use #004040 as the deepest, most stable color for main headers, branding, or dark mode.

secondary

Employ #006060 as a supportive deep teal for subheadings, important text, or active states.

accent

Apply #00BFBF as the brightest, most refreshing highlight for calls-to-action, alerts, or key features.

background

Utilize #00A0A0 as a mid-tone, vibrant background for content areas, providing energy and clarity.

text

Pair #004040 with light backgrounds for excellent contrast, or use white/light gray on darker backgrounds.

Accessibility notes

#00BFBF will require very dark text (e.g., #004040 or black) to ensure readability on light backgrounds.
Ensure sufficient contrast when using #00A0A0 as a background for text, especially for smaller fonts.
Avoid using #008080 and #00A0A0 for small text on each other due to similar luminosity.
Always verify WCAG AA contrast standards for all text and background combinations.

Recommended combinations

Lagoon Core

Creates a strong, immersive foundation for primary branding or elegant dark mode interfaces.

#004040 · #006060 · #008080

Tropical Gleam

Ideal for bright, inviting calls-to-action and clear content against a vibrant background.

#00BFBF · #00A0A0 · #004040

Water Flow

Suitable for interactive elements, progress bars, or illustrating movement and freshness.

#008080 · #00A0A0 · #006060

CSS variables

:root {
  --emerald-lagoon-depths-1: #008080;
  --emerald-lagoon-depths-2: #00A0A0;
  --emerald-lagoon-depths-3: #006060;
  --emerald-lagoon-depths-4: #004040;
  --emerald-lagoon-depths-5: #00BFBF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-lagoon-depths": {
        1: "#008080",
        2: "#00A0A0",
        3: "#006060",
        4: "#004040",
        5: "#00BFBF",
      }
    }
  }
}

Hex values

Color 1#008080

Color 2#00A0A0

Color 3#006060

Color 4#004040

Color 5#00BFBF

Accessibility

Contrast checker

1.5:1Fail

2.4:1Fail

2.1:1Fail

1.5:1Fail

2.3:1Fail

3.6:1AA18

1.4:1Fail

1.5:1Fail

2.3:1Fail

1.6:1Fail

3.2:1AA18

2.4:1Fail

3.6:1AA18

1.6:1Fail

5.1:1AA

2.1:1Fail

1.4:1Fail

3.2:1AA18

5.1:1AA

Similar palettes

More like Emerald Lagoon Depths

Emerald Lagoon Depths

See it in context.

Ready when you are.

Built with Emerald Lagoon Depths.

How to use Emerald Lagoon Depths

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Lagoon Core

Tropical Gleam

Water Flow

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Emerald Lagoon Depths