Back to palettes

Palette

Seaside Glass Shard

Cool, translucent teals and aquas, like smoothed sea glass shards glistening on a sandy shore.

coolminimal5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Seaside Glass Shard 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 Seaside Glass Shard.

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

Data visualization

#AFD9D9#80CCCC#4DBDBD#1AA3A3#007A7A

Palette guide

How to use Seaside Glass Shard

Overview

The Seaside Glass Shard palette embodies the cool, translucent teals and aquas of smoothed sea glass glistening on a sandy shore. Ranging from light aqua #AFD9D9 to vibrant #80CCCC, striking #4DBDBD, deep #1AA3A3, and profound #007A7A, this palette is refreshing and invigorating. For designers and developers, it offers a dynamic yet harmonious spectrum perfect for conveying cleanliness, sustainability, and a connection to water. Its crisp, cool tones are excellent for creating engaging digital experiences, eco-conscious branding, or vibrant, modern visual identities.

Best used for

  • Eco-friendly product branding
  • Spa and wellness center websites
  • Aquatic sports and dive shop designs
  • Modern tech and software interfaces
  • Sustainable fashion marketing
  • Clean, refreshing digital art

Suggested color roles

primary

Utilize #007A7A as the dominant primary color for strong branding, main calls to action, or impactful headers, providing depth.

secondary

Employ #1AA3A3 for supporting elements like secondary buttons, subheadings, or key data points, offering vibrant balance.

accent

Apply #4DBDBD as a bright, energetic accent for interactive elements, hover states, or graphic highlights, drawing attention effectively.

background

Use #AFD9D9 as a light, airy background color, providing a clean and refreshing base that allows other colors to pop.

text

For excellent contrast and readability, use #007A7A for body text on lighter backgrounds. A pure white works beautifully for text on #007A7A or #1AA3A3.

Accessibility notes

  • Text in #007A7A on #AFD9D9 will offer strong contrast, meeting WCAG AA or AAA standards.
  • Ensure interactive elements using #1AA3A3 or #4DBDBD have sufficient contrast against their backgrounds.
  • Avoid using #AFD9D9 for small text against similarly light colors like #80CCCC.
  • Consider a pure white for text on darker shades like #007A7A and #1AA3A3 for maximum readability.

Recommended combinations

Deep Ocean

Creates a bold, refreshing look, ideal for environmental or aquatic themes.

#007A7A · #4DBDBD · #AFD9D9

Glistening Shard

Perfect for a vibrant, clean aesthetic, suitable for modern tech or wellness brands.

#1AA3A3 · #80CCCC · #AFD9D9

Aqua Flow

Offers a dynamic, aquatic feel, excellent for engaging interactive designs or data visualizations.

#007A7A · #1AA3A3 · #80CCCC

CSS variables

:root {
  --seaside-glass-shard-1: #AFD9D9;
  --seaside-glass-shard-2: #80CCCC;
  --seaside-glass-shard-3: #4DBDBD;
  --seaside-glass-shard-4: #1AA3A3;
  --seaside-glass-shard-5: #007A7A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "seaside-glass-shard": {
        1: "#AFD9D9",
        2: "#80CCCC",
        3: "#4DBDBD",
        4: "#1AA3A3",
        5: "#007A7A",
      }
    }
  }
}

Related searches

teal aqua color palettesea glass inspired colorsrefreshing green blue schemeeco friendly brand colorsvibrant coastal aesthetic

Palette colors

Hex values

Color 1#AFD9D9
·
Color 2#80CCCC
·
Color 3#4DBDBD
·
Color 4#1AA3A3
·
Color 5#007A7A
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.5:1Fail
2:1Fail
3.4:1AA18
2
1.2:1Fail
1.2:1Fail
1.7:1Fail
2.8:1Fail
3
1.5:1Fail
1.2:1Fail
1.4:1Fail
2.3:1Fail
4
2:1Fail
1.7:1Fail
1.4:1Fail
1.7:1Fail
5
3.4:1AA18
2.8:1Fail
2.3:1Fail
1.7:1Fail

Similar palettes

More like Seaside Glass Shard

View all cool
Glacial Peak Air
Permafrost Aquamarine
Urban Glass Facade
Alpine Ridge Frost
Arctic Chill Breeze
Arctic Fox