Palette

Sapphire Tide Pool

Vibrant and deep blues like the clear, sparkling water found in a sapphire-hued tide pool.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sapphire Tide Pool 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 Sapphire Tide Pool.

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

Data visualization

#002B4C#004D81#007AB3#00A9E7#00DFFF

Palette guide

How to use Sapphire Tide Pool

Overview

The "Sapphire Tide Pool" palette offers vibrant and deep blues, mimicking the clear, sparkling water found in a sapphire-hued tide pool. This serene and jewel-like collection progresses from the profound depth of #002B4C (Very Dark Cyan-Blue) and the rich #004D81 (Dark Cyan-Blue), through the engaging #007AB3 (Medium Cyan-Blue) and #00A9E7 (Bright Cyan-Blue), culminating in the brilliant #00DFFF (Azure). It’s an ideal choice for designs seeking to evoke clarity, freshness, and a modern aquatic elegance, perfect for technology interfaces, marine research, or contemporary branding that values a clean, deep blue aesthetic.

Best used for

Modern tech company branding
Marine research or conservation initiatives
Water purification product marketing
High-end resort or travel agency websites
Clean energy sector communications
Digital dashboards and data visualization

Suggested color roles

primary

#004D81 (Dark Cyan-Blue) - A strong, reliable blue for main headings, navigation, or core brand elements, conveying expertise and depth.

secondary

#007AB3 (Medium Cyan-Blue) - A vibrant, accessible blue for subheadings, key information, or secondary calls-to-action, providing visual interest.

accent

#00A9E7 (Bright Cyan-Blue) - A brilliant, energetic blue for interactive elements, highlights, or to draw attention to crucial details.

background

#F0F8FF (Alice Blue) - A very light, near-white background with a subtle blue tint, providing a crisp, clean canvas that allows the blues to truly shine.

text

#002B4C (Very Dark Cyan-Blue) - The deepest blue in the palette, ensuring excellent readability for body text against lighter backgrounds, maintaining a cohesive and professional look.

Accessibility notes

Ensure #002B4C text on #F0F8FF background meets WCAG contrast standards for all text sizes.
Be cautious using #00A9E7 or #00DFFF for small text on light backgrounds; they are better suited for accents or larger titles.
Avoid using only color to convey information, especially for users with color vision deficiencies.
Consider alternative text for graphics that rely heavily on these specific blue gradients for meaning.

Recommended combinations

Deep Current

Darkest blue for a commanding header, azure for energetic highlights, and alice blue as a clean background.

#002B4C · #00DFFF · #004D81

Sparkling Depths

Medium blue for primary content, bright cyan for interactive elements, and darkest blue for important text.

#004D81 · #00A9E7 · #002B4C

Clear Flow

Medium cyan as a dominant color for sections, alice blue for background, and dark cyan for clear calls to action.

#007AB3 · #004D81 · #00A9E7

CSS variables

:root {
  --sapphire-tide-pool-1: #002B4C;
  --sapphire-tide-pool-2: #004D81;
  --sapphire-tide-pool-3: #007AB3;
  --sapphire-tide-pool-4: #00A9E7;
  --sapphire-tide-pool-5: #00DFFF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sapphire-tide-pool": {
        1: "#002B4C",
        2: "#004D81",
        3: "#007AB3",
        4: "#00A9E7",
        5: "#00DFFF",
      }
    }
  }
}

Hex values

Color 1#002B4C

Color 2#004D81

Color 3#007AB3

Color 4#00A9E7

Color 5#00DFFF

Accessibility

Contrast checker

1.6:1Fail

3.1:1AA18

5.4:1AA

9:1AAA

1.6:1Fail

1.9:1Fail

3.3:1AA18

5.5:1AA

3.1:1AA18

1.9:1Fail

1.8:1Fail

2.9:1Fail

5.4:1AA

3.3:1AA18

1.8:1Fail

1.7:1Fail

9:1AAA

5.5:1AA

2.9:1Fail

1.7:1Fail

Similar palettes

More like Sapphire Tide Pool

View all cool

Abyssal Current Glide