Palette

Vintage Seaside Charm

Soft blues and muted indigo inspired by nostalgic seaside holidays and weathered fishing boats.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Vintage Seaside Charm 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 Vintage Seaside Charm.

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

Data visualization

#ADD8E6#87CEEB#4682B4#6A5ACD#483D8B

Palette guide

How to use Vintage Seaside Charm

Overview

The Vintage Seaside Charm palette captures the serene essence of nostalgic coastal holidays, blending soft blues and muted indigos. This collection features the airy #ADD8E6 and the calming #87CEEB, perfect for sky or water elements. The deeper #4682B4 provides a stable, nautical feel, while the more unique #6A5ACD and the profound #483D8B introduce a sophisticated, weathered indigo depth. Designers can use this palette to create tranquil web designs, charming branding for coastal businesses, or evocative illustrations that recall weathered fishing boats and peaceful ocean views. It's ideal for conveying a sense of calm, tradition, and refreshing simplicity.

Best used for

Coastal brand identities
Travel and tourism websites
Nautical-themed product design
Children's book illustrations
Relaxing UI/UX designs
Home decor mood boards

Suggested color roles

primary

A classic, sturdy blue like #4682B4 evoking deep ocean or sturdy boats, ideal for main headings or key brand elements.

secondary

A sophisticated, muted indigo like #6A5ACD that complements the primary, suitable for subheadings or secondary calls-to-action.

accent

The darkest, richest indigo, #483D8B, used sparingly for powerful accents, important buttons, or deep shadows.

background

A very light, sky-like blue like #ADD8E6, providing an open and airy canvas for the entire palette.

text

Use the deep #483D8B for prominent text and headings. For body text, a dark navy or near-black will ensure optimal readability against light backgrounds like #ADD8E6.

Accessibility notes

Ensure high contrast between dark text (#483D8B) and light backgrounds (#ADD8E6, #87CEEB).
Avoid using #ADD8E6 or #87CEEB for text on light backgrounds due to insufficient contrast.
For interactive elements, ensure distinct hover/focus states, perhaps using bolder outlines or slight color shifts.
Test the legibility of #6A5ACD on mid-tone backgrounds to avoid visual strain.

Recommended combinations

Ocean Depth

Light sky background transitioning to deep ocean for a serene, layered look.

#ADD8E6 · #4682B4 · #483D8B

Nautical Stripes

Repeating patterns, graphic elements, or distinct sections in a layout.

#ADD8E6 · #87CEEB · #4682B4

Weathered Charm

Sophisticated branding elements, textured backgrounds, or subtle gradients evoking aged materials.

#6A5ACD · #4682B4 · #483D8B

CSS variables

:root {
  --vintage-seaside-charm-1: #ADD8E6;
  --vintage-seaside-charm-2: #87CEEB;
  --vintage-seaside-charm-3: #4682B4;
  --vintage-seaside-charm-4: #6A5ACD;
  --vintage-seaside-charm-5: #483D8B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vintage-seaside-charm": {
        1: "#ADD8E6",
        2: "#87CEEB",
        3: "#4682B4",
        4: "#6A5ACD",
        5: "#483D8B",
      }
    }
  }
}

Hex values

Color 1#ADD8E6

Color 2#87CEEB

Color 3#4682B4

Color 4#6A5ACD

Color 5#483D8B

Accessibility

Contrast checker

1.1:1Fail

2.7:1Fail

3.5:1AA18

5.9:1AA

1.1:1Fail

2.4:1Fail

3:1AA18

5.2:1AA

2.7:1Fail

2.4:1Fail

1.3:1Fail

2.2:1Fail

3.5:1AA18

3:1AA18

1.3:1Fail

1.7:1Fail

5.9:1AA

5.2:1AA

2.2:1Fail

1.7:1Fail

Similar palettes

More like Vintage Seaside Charm