Back to palettes

Palette

Coastal Seaglass Hues

Soft, muted blues and greens like weathered pieces of sea glass found on a serene shore.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Coastal Seaglass Hues 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 Coastal Seaglass Hues.

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

Data visualization

#C0D6E4#A8C2D3#7DA3B4#5C8AA6#B3CDDC

Palette guide

How to use Coastal Seaglass Hues

Overview

The Coastal Seaglass Hues palette presents a refined collection of soft, muted blues, mirroring the weathered beauty of sea glass. Shades like the gentle #C0D6E4 and #A8C2D3 offer an airy, expansive feel, while #7DA3B4 introduces a slightly deeper, more grounded blue. The palette is anchored by the elegant #5C8AA6, providing a sophisticated depth, with #B3CDDC acting as a versatile mid-tone. This harmonious blend is perfect for designers seeking to create serene, understated, and timeless aesthetics. It's especially suited for projects that aim to evoke a sense of calm, clarity, and subtle natural beauty.

Best used for

  • Luxury home staging and interior design
  • High-end fashion and lifestyle blogs
  • Wedding and event planning branding
  • Calm-focused digital applications
  • Art gallery websites
  • Ceramics and pottery branding

Suggested color roles

primary

Utilize #A8C2D3 as a dominant, soft blue for main sections or branding, establishing a calm foundation.

secondary

Employ #7DA3B4 for secondary content blocks, navigation, or subtle graphical elements to add depth.

accent

Introduce #C0D6E4 as a light, ethereal accent for highlights, icons, or delicate decorative touches.

background

Choose #C0D6E4 for a light, airy background, or #B3CDDC for a slightly more saturated yet soft canvas.

text

Use #5C8AA6 for body text and headings for good readability against lighter palette colors, or a dark charcoal.

Accessibility notes

  • The darker #5C8AA6 provides good contrast for text on #C0D6E4, #A8C2D3, and #B3CDDC.
  • Ensure sufficient contrast when using #C0D6E4 or #A8C2D3 for text on any background, as they are very light.
  • Avoid using #B3CDDC for text on #C0D6E4 backgrounds; opt for a darker color for text.
  • Check contrast ratios for all text pairings, especially for large blocks of content.

Recommended combinations

Muted Ocean

Create a sophisticated, deep-to-light gradient for headers, main content, and light accents in web design.

#5C8AA6 · #7DA3B4 · #C0D6E4

Sky Whisper

Ideal for clean, minimalist interfaces with a very light background, a soft mid-tone, and strong dark text.

#C0D6E4 · #A8C2D3 · #5C8AA6

Seaglass Layers

Use for subtle visual layering, combining mid-tone blues for depth and a lighter blue for highlights.

#B3CDDC · #7DA3B4 · #A8C2D3

CSS variables

:root {
  --coastal-seaglass-hues-1: #C0D6E4;
  --coastal-seaglass-hues-2: #A8C2D3;
  --coastal-seaglass-hues-3: #7DA3B4;
  --coastal-seaglass-hues-4: #5C8AA6;
  --coastal-seaglass-hues-5: #B3CDDC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "coastal-seaglass-hues": {
        1: "#C0D6E4",
        2: "#A8C2D3",
        3: "#7DA3B4",
        4: "#5C8AA6",
        5: "#B3CDDC",
      }
    }
  }
}

Related searches

muted blue color palettesea glass effect colorsserene cool tonescalm sophisticated bluesunderstated coastal design

Palette colors

Hex values

Color 1#C0D6E4
·
Color 2#A8C2D3
·
Color 3#7DA3B4
·
Color 4#5C8AA6
·
Color 5#B3CDDC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.8:1Fail
2.5:1Fail
1.1:1Fail
2
1.2:1Fail
1.5:1Fail
2:1Fail
1.1:1Fail
3
1.8:1Fail
1.5:1Fail
1.4:1Fail
1.6:1Fail
4
2.5:1Fail
2:1Fail
1.4:1Fail
2.2:1Fail
5
1.1:1Fail
1.1:1Fail
1.6:1Fail
2.2:1Fail

Similar palettes

More like Coastal Seaglass Hues

View all cool
Sea Glass Serenity
Minty Sea Glass
Mystic Sea Glass
Seaglass Pebbles
Seaside Evening Blush
Aegean Coastline Calm