Back to palettes

Palette

Sunny Coast Shallows

Golden sands and clear cerulean waters, embodying the calm, sunny tranquility of a tropical beach.

Warmnatural5 colors
More Warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sunny Coast Shallows 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 Sunny Coast Shallows.

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

Data visualization

#F2E3BC#FAD7A0#A0C4E2#7BADE0#E9F4FF

Palette guide

How to use Sunny Coast Shallows

Overview

The Sunny Coast Shallows palette evokes the serene beauty of golden sands and clear cerulean waters, embodying the calm, sunny tranquility of a tropical beach. This harmonious collection features soft, sandy neutrals like #F2E3BC and #FAD7A0, beautifully contrasted with refreshing blues such as #A0C4E2 and the deeper #7BADE0. The ethereal light blue #E9F4FF provides an airy touch. Designers can leverage this palette for projects requiring a sense of peace, natural beauty, and sophistication. Developers will find these hex codes excellent for creating tranquil UIs, elegant branding, or any digital product aiming for a calming, natural, and inviting visual identity.

Best used for

  • Spa and wellness branding
  • Coastal real estate websites
  • Travel and tourism brochures
  • Meditation or mindfulness apps
  • Home decor and interior design concepts
  • Wedding invitations or event branding

Suggested color roles

primary

Use #A0C4E2 as a calming and inviting blue for main interactive elements or primary branding.

secondary

Apply #FAD7A0 as a warm, sandy neutral for supportive elements or background accents.

accent

Utilize #7BADE0 as a deeper, more impactful blue for highlights or important calls to action.

background

Employ #E9F4FF as an airy, light, and tranquil base for backgrounds, ensuring dark text for readability.

text

For text, use dark charcoal or navy for readability on #F2E3BC, #FAD7A0, and #E9F4FF. White works well on #A0C4E2 and #7BADE0.

Accessibility notes

  • #F2E3BC, #FAD7A0, and #E9F4FF have low contrast with white text; use dark text (e.g., black, dark grey, or navy) for readability.
  • Ensure sufficient contrast between the lighter blues (#A0C4E2) and the lighter sandy tones (#FAD7A0) for interactive elements.
  • The darker blue #7BADE0 provides good contrast with white text, suitable for clear headings or buttons.
  • Consider using a slightly darker shade of blue or grey for body text over the very light backgrounds.

Recommended combinations

Beach Serenity

Tranquil website backgrounds, elegant branding, or peaceful user interfaces.

#E9F4FF · #F2E3BC · #A0C4E2

Ocean Breeze

Inviting hero sections, soothing call-to-actions, or natural product packaging.

#FAD7A0 · #7BADE0 · #A0C4E2

Sandy Shallows

Subtle gradients, sophisticated infographics, or calming design accents.

#F2E3BC · #E9F4FF · #7BADE0

CSS variables

:root {
  --sunny-coast-shallows-1: #F2E3BC;
  --sunny-coast-shallows-2: #FAD7A0;
  --sunny-coast-shallows-3: #A0C4E2;
  --sunny-coast-shallows-4: #7BADE0;
  --sunny-coast-shallows-5: #E9F4FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sunny-coast-shallows": {
        1: "#F2E3BC",
        2: "#FAD7A0",
        3: "#A0C4E2",
        4: "#7BADE0",
        5: "#E9F4FF",
      }
    }
  }
}

Related searches

beach sand ocean palettetranquil blue and beige colorscalming web design schemetropical resort brandinglight natural color combination

Palette colors

Hex values

Color 1#F2E3BC
·
Color 2#FAD7A0
·
Color 3#A0C4E2
·
Color 4#7BADE0
·
Color 5#E9F4FF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.4:1Fail
1.9:1Fail
1.1:1Fail
2
1.1:1Fail
1.3:1Fail
1.7:1Fail
1.2:1Fail
3
1.4:1Fail
1.3:1Fail
1.3:1Fail
1.6:1Fail
4
1.9:1Fail
1.7:1Fail
1.3:1Fail
2.1:1Fail
5
1.1:1Fail
1.2:1Fail
1.6:1Fail
2.1:1Fail

Similar palettes

More like Sunny Coast Shallows

View all Warm
Arid Flower Vista
Burnt Sugar Glaze
Golden Plains Sunlight
Harvest Pumpkin Glow
Orchard Crisp Apple
Sun Drenched Piazza