Back to palettes

Palette

Seaglass Pebbles

Smooth, muted aquamarines and greens, reminiscent of weathered seaglass scattered on a shore.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#B0D8D8#8BCBCB#67BDBD#43AFAFA#2A8F8F

Palette guide

How to use Seaglass Pebbles

Overview

The Seaglass Pebbles palette offers smooth, muted aquamarines and greens, reminiscent of weathered seaglass scattered on a tranquil shore. With a gradient from the light #B0D8D8 to the deep #2A8F8F, including the serene #67BDBD and #43AFAF, this scheme is inherently calm and cool. Designers can utilize these hues to evoke a sense of tranquility, natural beauty, and a sophisticated, understated aesthetic. Developers will find this palette excellent for crafting clean, inviting user interfaces that prioritize readability and a soothing user experience. It's perfectly suited for brands focused on wellness, coastal living, or any domain requiring a gentle, organic, and peaceful visual identity.

Best used for

  • Coastal-themed branding and web design
  • Sustainable living platforms and eco-friendly products
  • Spa and wellness centers and services
  • Clean tech UI and software interfaces
  • Nature-inspired blogs and photography
  • Eco-friendly product packaging and marketing

Suggested color roles

primary

Use #2A8F8F as a deep teal for main headings, navigation, or strong brand elements, conveying stability and depth.

secondary

Apply #67BDBD for supporting content, subheadings, or background accents, adding a gentle aqua touch.

accent

Employ #8BCBCB for refreshing highlights, interactive states, or calls to action, providing a subtle pop.

background

Utilize #B0D8D8 as a light aqua background, providing a soft, smooth, and expansive base for content.

text

For optimal readability, use #2A8F8F or a deep charcoal on light backgrounds like #B0D8D8.

Accessibility notes

  • The contrast of #2A8F8F on #B0D8D8 is good for most text sizes.
  • Use #67BDBD for larger text or headings on #B0D8D8, as its contrast might be low for small body text.
  • Avoid using #8BCBCB or #43AFAF for small text on #B0D8D8 due to insufficient contrast.
  • Ensure interactive elements in lighter tones have clear visual cues beyond color alone for accessibility.

Recommended combinations

Deep Sea Glass

Creates a clean, readable design with deep teal text on a light aqua background, accented by a mid-aqua.

#B0D8D8 · #2A8F8F · #67BDBD

Aqua Gradient

Ideal for smooth transitions in headers, hero sections, or data visualizations, mimicking natural aquatic tones.

#B0D8D8 · #8BCBCB · #67BDBD

Weathered Shore

Combines the darkest teal with a mid-teal and light aqua for a balanced, natural aesthetic, evoking a tranquil shore.

#2A8F8F · #B0D8D8 · #67BDBD

CSS variables

:root {
  --seaglass-pebbles-1: #B0D8D8;
  --seaglass-pebbles-2: #8BCBCB;
  --seaglass-pebbles-3: #67BDBD;
  --seaglass-pebbles-4: #43AFAFA;
  --seaglass-pebbles-5: #2A8F8F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "seaglass-pebbles": {
        1: "#B0D8D8",
        2: "#8BCBCB",
        3: "#67BDBD",
        4: "#43AFAFA",
        5: "#2A8F8F",
      }
    }
  }
}

Related searches

smooth aqua paletteweathered green blueserene seaglass designtranquil coastal hexbeach pebble colors

Palette colors

Hex values

Color 1#B0D8D8
·
Color 2#8BCBCB
·
Color 3#67BDBD
·
Color 4#43AFAFA
·
Color 5#2A8F8F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.4:1Fail
1.2:1Fail
2.5:1Fail
2
1.2:1Fail
1.2:1Fail
1.4:1Fail
2.1:1Fail
3
1.4:1Fail
1.2:1Fail
1.7:1Fail
1.8:1Fail
4
1.2:1Fail
1.4:1Fail
1.7:1Fail
3:1Fail
5
2.5:1Fail
2.1:1Fail
1.8:1Fail
3:1Fail

Similar palettes

More like Seaglass Pebbles

View all cool
Azure Lagoon Shimmer
Coastal Foam Shimmer
Coastal Seaglass Hues
Coastal Seaglass Shimmer
Deep Sea Flora Bed
Mediterranean Coast Breeze