Back to palettes

Palette

Ocean Shore Treasure

Refreshing and clean, like sea glass washed ashore, capturing the subtle greens and blues of the ocean's edge.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ocean Shore Treasure 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 Ocean Shore Treasure.

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

Data visualization

#E6F7FA#B9E7E0#8DD5C7#62C3AF#3FB19C

Palette guide

How to use Ocean Shore Treasure

Overview

The Ocean Shore Treasure palette is a refreshing and clean collection, reminiscent of sea glass washed ashore, capturing the subtle greens and blues of the ocean's edge. It gracefully transitions from the almost white #E6F7FA, through the soft teal #B9E7E0 and the serene aquamarine #8DD5C7, to the more vibrant seafoam #62C3AF and the deep, rich turquoise #3FB19C. This gradient of cool tones offers a sense of calm and natural beauty. Designers can leverage this palette for projects requiring a fresh, eco-friendly, or tranquil aesthetic. Developers will find these hex codes ideal for creating user interfaces that feel organic, sophisticated, and soothing, perfect for sustainability brands, nature-themed apps, or health services.

Best used for

  • Sustainable brand identities
  • Nature conservation websites
  • Spa and wellness center branding
  • Eco-friendly product packaging
  • Educational materials on marine life
  • Health and organic food packaging

Suggested color roles

primary

#3FB19C (Deep Turquoise) - Excellent for primary headings, navigation, or strong brand statements, providing depth and authority.

secondary

#62C3AF (Seafoam Green) - Use for subheadings, secondary buttons, or accent panels that need a vibrant, yet soothing, touch.

accent

#8DD5C7 (Aquamarine) - Ideal for interactive elements, data visualization, or subtle highlights, offering a refreshing pop.

background

#E6F7FA (Light Aqua) - Provides a very light, airy canvas, allowing the deeper greens and blues to shine.

text

A dark charcoal like #333333 or even #3FB19C for headings, ensuring optimal readability on light backgrounds.

Accessibility notes

  • #E6F7FA is very light; use dark text (e.g., black) for all content on this background.
  • #3FB19C provides excellent contrast for light text if needed, but dark text on #E6F7FA works best.
  • Text in #B9E7E0, #8DD5C7, and #62C3AF will require dark text for WCAG AA contrast.
  • Pay attention to contrast when using adjacent colors like #B9E7E0 and #8DD5C7 for distinct elements.

Recommended combinations

Deep Sea

A very light background with a strong deep turquoise for branding and a vibrant seafoam for accents, creating a sophisticated natural look.

#E6F7FA · #3FB19C · #62C3AF

Sea Glass

Layered teals and aquamarines for a harmonious and organic feel, with the deepest turquoise providing grounding elements.

#B9E7E0 · #8DD5C7 · #3FB19C

Fresh Shore

A crisp white base with a vibrant seafoam green for key elements and a softer aquamarine for supporting details, evoking freshness.

#E6F7FA · #62C3AF · #8DD5C7

CSS variables

:root {
  --ocean-shore-treasure-1: #E6F7FA;
  --ocean-shore-treasure-2: #B9E7E0;
  --ocean-shore-treasure-3: #8DD5C7;
  --ocean-shore-treasure-4: #62C3AF;
  --ocean-shore-treasure-5: #3FB19C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ocean-shore-treasure": {
        1: "#E6F7FA",
        2: "#B9E7E0",
        3: "#8DD5C7",
        4: "#62C3AF",
        5: "#3FB19C",
      }
    }
  }
}

Related searches

sea glass color paletterefreshing green blue schemeocean edge calm colorssustainable brand turquoisenature inspired UI design

Palette colors

Hex values

Color 1#E6F7FA
·
Color 2#B9E7E0
·
Color 3#8DD5C7
·
Color 4#62C3AF
·
Color 5#3FB19C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.5:1Fail
1.9:1Fail
2.4:1Fail
2
1.2:1Fail
1.2:1Fail
1.6:1Fail
2:1Fail
3
1.5:1Fail
1.2:1Fail
1.3:1Fail
1.6:1Fail
4
1.9:1Fail
1.6:1Fail
1.3:1Fail
1.2:1Fail
5
2.4:1Fail
2:1Fail
1.6:1Fail
1.2:1Fail

Similar palettes

More like Ocean Shore Treasure

View all cool
Azure Coast Dream
Aqua Marine Vista
Azure Lagoon Shimmer
Azure Tide Pool
Cerulean Coast Dream
Cerulean Coastline Calm