Back to palettes

Palette

Emerald Grotto Shimmer

Deep and sparkling hues found in a hidden grotto, where sunlight dances on cool emerald waters.

coolelegant5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Emerald Grotto Shimmer 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 Grotto Shimmer.

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

Data visualization

#0B4F6C#208B81#7FC0BE#29BFB3#156B7F

Palette guide

How to use Emerald Grotto Shimmer

Overview

The Emerald Grotto Shimmer palette presents a captivating blend of deep blues and vibrant teals, reminiscent of sunlight dancing on cool, hidden waters. Anchored by the profound #0B4F6C and #156B7F, it contrasts beautifully with the lively #208B81 and #29BFB3, while #7FC0BE offers a soft, ethereal touch. This collection is perfect for designs aiming to convey mystery, elegance, and a refreshing sense of depth. Ideal for luxurious branding, sophisticated web interfaces, or projects that need a distinctive, cool color scheme. The interplay between the deeper blues and brighter teals creates a dynamic visual narrative, ensuring an engaging and memorable user experience.

Best used for

  • Luxury travel and tourism websites
  • High-end spa and beauty brands
  • Modern tech start-up branding
  • Abstract art and digital design
  • Aquatic-themed event decor
  • Interactive data visualizations

Suggested color roles

primary

Use #0B4F6C as a deep, sophisticated base for main branding, headers, or dark mode interfaces.

secondary

Employ #156B7F as a supportive deep blue-green for subheadings, important text, or secondary UI elements.

accent

Apply #29BFB3 as a vibrant, shimmering highlight for calls-to-action, interactive elements, or key features.

background

Utilize #7FC0BE as a light, airy background for content areas, providing a clean and ethereal canvas.

text

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

Accessibility notes

  • Ensure #7FC0BE has sufficient contrast with lighter text; use darker text (e.g., #0B4F6C or black) for readability.
  • Pair #0B4F6C, #156B7F, or #208B81 with white or light gray text for optimal legibility on dark backgrounds.
  • Avoid using #208B81 and #29BFB3 together for small text due to similar luminosity and potential low contrast.
  • Always verify WCAG AA contrast standards for all text and background combinations.

Recommended combinations

Deep Water

Creates a strong, elegant foundation for primary branding and navigation.

#0B4F6C · #156B7F · #208B81

Shimmering Surface

Ideal for vibrant calls-to-action and highlights against a soft, ethereal background.

#29BFB3 · #7FC0BE · #0B4F6C

Grotto Depths

Suitable for conveying depth and subtle interaction in content sections or data displays.

#208B81 · #156B7F · #7FC0BE

CSS variables

:root {
  --emerald-grotto-shimmer-1: #0B4F6C;
  --emerald-grotto-shimmer-2: #208B81;
  --emerald-grotto-shimmer-3: #7FC0BE;
  --emerald-grotto-shimmer-4: #29BFB3;
  --emerald-grotto-shimmer-5: #156B7F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-grotto-shimmer": {
        1: "#0B4F6C",
        2: "#208B81",
        3: "#7FC0BE",
        4: "#29BFB3",
        5: "#156B7F",
      }
    }
  }
}

Related searches

emerald teal blue paletteshimmering water colorselegant grotto schememysterious blue greensophisticated aquatic design

Palette colors

Hex values

Color 1#0B4F6C
·
Color 2#208B81
·
Color 3#7FC0BE
·
Color 4#29BFB3
·
Color 5#156B7F
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.2:1Fail
4.3:1AA18
3.9:1AA18
1.5:1Fail
2
2.2:1Fail
2:1Fail
1.8:1Fail
1.5:1Fail
3
4.3:1AA18
2:1Fail
1.1:1Fail
3:1Fail
4
3.9:1AA18
1.8:1Fail
1.1:1Fail
2.7:1Fail
5
1.5:1Fail
1.5:1Fail
3:1Fail
2.7:1Fail

Similar palettes

More like Emerald Grotto Shimmer

View all cool