Back to palettes

Palette

Deep Reef Glow

Luminous blues transition from the deep abyss to glowing aquas, like a vibrant, sub-aquatic wonderland.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#002E4D#005C8A#008BB8#00C3E6#7DEFFF

Palette guide

How to use Deep Reef Glow

Overview

The Deep Reef Glow palette transitions from deep abyss to glowing aquas, mimicking a vibrant, sub-aquatic wonderland. Ranging from the profound #002E4D to the luminous #7DEFFF, this palette is ideal for designs that demand energy, dynamism, and a sense of vibrant exploration. Designers can craft immersive digital experiences, captivating branding, and lively UI themes. Developers will find these hex codes perfect for projects related to marine life, adventure, or any application that benefits from a fresh, energetic, and visually striking aesthetic. The progression from #005C8A to #00C3E6 allows for excellent depth and vivid highlights.

Best used for

  • Tropical tourism websites or apps
  • Scuba diving or snorkeling tour operators
  • Youth-focused educational platforms on marine biology
  • Interactive game interfaces (aquatic themes)
  • Fitness or active lifestyle brands (water sports)
  • Environmental awareness campaigns (coral reefs)

Suggested color roles

primary

Utilize #005C8A as the main background or primary content color, providing a deep, yet vibrant, and stable foundation.

secondary

Apply #008BB8 for secondary content areas, panels, or navigation, offering a clear visual distinction and layered effect.

accent

Introduce #7DEFFF as a powerful, luminous accent for calls-to-action, key features, or interactive elements, ensuring maximum impact.

background

The deepest hue, #002E4D, is excellent for expansive backgrounds or header sections, establishing an immediate tone of profound depth.

text

For optimal readability, use a crisp white or very light gray. #7DEFFF can be used for larger headings or highlights on the darkest backgrounds.

Accessibility notes

  • Ensure high contrast for text on #002E4D, #005C8A, and #008BB8 by using light text (e.g., white or #7DEFFF).
  • The lightest color, #7DEFFF, provides excellent contrast for primary text against all darker blues in the palette.
  • Avoid using #002E4D and #005C8A for small text or critical UI elements in close proximity without careful contrast checks.
  • Always test color combinations with accessibility tools to ensure WCAG compliance for readability.

Recommended combinations

Abyss Layers

Ideal for creating a layered, deep background or card system, conveying gradual depth and vibrant undertones.

#002E4D · #005C8A · #008BB8

Reef Glow

Use #005C8A as a base, with #00C3E6 for secondary elements and #7DEFFF for vibrant, glowing highlights or interactive states.

#005C8A · #00C3E6 · #7DEFFF

Electric Depth

Excellent for a dark, profound background with a clear, electric accent and a strong mid-tone for supporting details.

#002E4D · #7DEFFF · #00C3E6

CSS variables

:root {
  --deep-reef-glow-1: #002E4D;
  --deep-reef-glow-2: #005C8A;
  --deep-reef-glow-3: #008BB8;
  --deep-reef-glow-4: #00C3E6;
  --deep-reef-glow-5: #7DEFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-reef-glow": {
        1: "#002E4D",
        2: "#005C8A",
        3: "#008BB8",
        4: "#00C3E6",
        5: "#7DEFFF",
      }
    }
  }
}

Related searches

vibrant blue color palettedeep aqua hex codesluminous ocean UI designelectric blue color schemetropical reef colors

Palette colors

Hex values

Color 1#002E4D
·
Color 2#005C8A
·
Color 3#008BB8
·
Color 4#00C3E6
·
Color 5#7DEFFF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
3.6:1AA18
6.6:1AA
10.5:1AAA
2
1.9:1Fail
1.9:1Fail
3.4:1AA18
5.4:1AA
3
3.6:1AA18
1.9:1Fail
1.8:1Fail
2.9:1Fail
4
6.6:1AA
3.4:1AA18
1.8:1Fail
1.6:1Fail
5
10.5:1AAA
5.4:1AA
2.9:1Fail
1.6:1Fail

Similar palettes

More like Deep Reef Glow

View all vibrant
Azure Lagoon Shimmer
Coral Reef Jewel
Electric Coral Reef
Electric Lagoon Dive
Electric Ocean Current
Paradise Lagoon Shimmer