Back to palettes

Palette

Calm Coastal Retreat

A tranquil blend of sea-inspired blues, gentle greens, and soft greys, ideal for a peaceful seaside escape.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Calm Coastal Retreat 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 Calm Coastal Retreat.

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

Data visualization

#ADCEDA#D0DBDF#E4ECED#BCCDCF#90AAB8

Palette guide

How to use Calm Coastal Retreat

Overview

The Calm Coastal Retreat palette offers a tranquil blend of sea-inspired blues, gentle greens, and soft greys, ideal for a peaceful seaside escape. This serene collection features a range of cool tones, from a light sky blue, #ADCEDA, to a soft grey-blue, #D0DBDF, and an almost white, #E4ECED. Deeper, more grounding tones like #BCCDCF (a muted blue-grey) and #90AAB8 (a mid-tone blue-grey) complete the palette, evoking misty shores and calm waters. Designers will find this palette excellent for creating relaxing, airy, and sophisticated visuals. Developers can leverage these colors to build serene and inviting user interfaces for brands focused on wellness, coastal living, or any application seeking a tranquil and refined aesthetic.

Best used for

  • Coastal living and home decor brands
  • Spa and wellness retreat marketing
  • Serene lifestyle blogs and apps
  • Beach-themed event invitations
  • Minimalist web design
  • Sustainable fashion with ocean themes

Suggested color roles

primary

Utilize #E4ECED as a soft, airy primary background, providing a clean and tranquil canvas.

secondary

Apply #D0DBDF for supporting elements, offering a gentle grey-blue that complements the primary.

accent

Introduce #ADCEDA as a refreshing, light blue accent for subtle highlights or interactive elements, adding a touch of sea.

background

Employ #E4ECED for clean, light backgrounds, creating a gentle and harmonious canvas.

text

Use #90AAB8 for main body text and headings, ensuring strong readability and a sophisticated, grounded feel against lighter backgrounds.

Accessibility notes

  • Ensure sufficient contrast when pairing #90AAB8 text with #E4ECED or #D0DBDF backgrounds for optimal readability.
  • Avoid using lighter blues/greys like #ADCEDA or #D0DBDF for small text against similar light backgrounds due to low contrast.
  • For interactive elements, use #90AAB8 or #BCCDCF to ensure clear affordance and meet WCAG contrast guidelines.
  • Test color combinations across different screen types to verify visual clarity for all users.

Recommended combinations

Sea Mist

Creates a soft, ethereal blend of light blues and greys, ideal for subtle gradients, backgrounds, or layered effects.

#ADCEDA · #E4ECED · #D0DBDF

Shoreline Depth

Offers a grounded yet serene feel, combining deep blue-grey with a light background and a mid-tone for text or important elements.

#90AAB8 · #E4ECED · #BCCDCF

Cool Breeze

Provides a harmonious blend of cool tones, suitable for content blocks or distinct sections, evoking calm coastal air.

#D0DBDF · #BCCDCF · #ADCEDA

CSS variables

:root {
  --calm-coastal-retreat-1: #ADCEDA;
  --calm-coastal-retreat-2: #D0DBDF;
  --calm-coastal-retreat-3: #E4ECED;
  --calm-coastal-retreat-4: #BCCDCF;
  --calm-coastal-retreat-5: #90AAB8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "calm-coastal-retreat": {
        1: "#ADCEDA",
        2: "#D0DBDF",
        3: "#E4ECED",
        4: "#BCCDCF",
        5: "#90AAB8",
      }
    }
  }
}

Related searches

calm coastal color paletteserene beach blueslight grey blue schemetranquil seaside colorsminimalist ocean palette

Palette colors

Hex values

Color 1#ADCEDA
·
Color 2#D0DBDF
·
Color 3#E4ECED
·
Color 4#BCCDCF
·
Color 5#90AAB8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.4:1Fail
1:1Fail
1.5:1Fail
2
1.2:1Fail
1.2:1Fail
1.2:1Fail
1.7:1Fail
3
1.4:1Fail
1.2:1Fail
1.4:1Fail
2:1Fail
4
1:1Fail
1.2:1Fail
1.4:1Fail
1.5:1Fail
5
1.5:1Fail
1.7:1Fail
2:1Fail
1.5:1Fail

Similar palettes

More like Calm Coastal Retreat

View all cool
Coastal Breeze
Coastal Foam Spray
Coastal Haze
Glacial Lagoon Calm
Pacific Haze Calm
Seaside Cottage Charm