🌊

Coastal Cottage

Where the sea meets the shore

A design system inspired by sun-bleached driftwood, weathered white clapboard, tumbled sea glass, and the gentle palette of beach cottages at low tide. Relaxed, warm, and quietly joyful.

01

Color Palette

Drawn from the tidal line: bleached wood, wet sand, shallow water, and the frosted colors of sea glass collected in a jar.

Whites & Sand

Driftwood White#F7F4F0
Weathered White#F0EBE3
Bleached Linen#EAE4DA
Sand#DED5C4
Warm Sand#D2C5AF
Wet Sand#B8A98E

Sea & Sky Blues

Sky Pale#E8F0F5
Sky Light#D1E3EE
Sea Mist#B5D0DE
Sea Glass#8BBCC9
Tide Blue#6AA4B5
Ocean Calm#4E8A9E
Deep Water#2E6476
Twilight Blue#1D4A5A

Sea Glass Accents

Glass Green#A7C9B8
Glass Aqua#8DC5C1
Glass Frost#C3DDD5
Glass Amber#D4B896

Driftwood & Rope

Driftwood Light#BFB199
Driftwood#9E8E74
Driftwood Dark#7A6C56
Rope#C4A872
Knot Brown#8B7355

Coral & Shell

Coral Soft#E8AFA1
Coral Muted#D49688
Shell Pink#F0DDD6
Shell Cream#F5EDE7

02

Typography

Three typefaces that feel like a handwritten note left on the porch railing: an elegant serif for display text, a rounded sans for readability, and a casual script for warmth.

Cormorant Garamond — Display & Headings

Morning light on still water

The tide pools are full of small wonders

Shells scattered along the high-water mark

3rem/300 Aa
1.8rem/500 Aa
1.3rem/600 Aa

Quicksand — Body & UI

The cottage sits where the dunes give way to sea grass, its white clapboard weathered to a soft grey by salt air and winter storms. Inside, the floorboards creak underfoot, and every window frames a different view of the water. Driftwood and sea glass crowd the windowsills.

Caption text — used for metadata, timestamps, and secondary information. Light and unobtrusive, like footprints fading in wet sand.

Caveat — Handwritten Accent

Gone to the beach. Back by sunset.

Wish you were here...

03

Spacing

A 4px base unit producing a gentle, breathable rhythm. Coastal spaces need room for the eye to wander.

--space-1
4px
--space-2
8px
--space-3
12px
--space-4
16px
--space-5
24px
--space-6
32px
--space-7
48px
--space-8
64px
--space-9
96px

04

Buttons

Pill-shaped and rounded like beach stones. Soft gradients recall the horizon where sky meets sea.

Primary

Secondary

Ghost

Accent Variants

Disabled

05

Forms

Clean inputs with soft borders, like the edge of the shoreline. Focus states glow with a gentle sea-glass tint.

We will send your confirmation here

06

Cards

Content containers with the soft, rounded feel of a beach cottage window. Gradient image placeholders evoke sand, sea, and shore.

Featured

Sandpiper Cove

A two-bedroom cottage with wide plank floors, a screened porch, and a private path down to the beach.

Oceanfront 2 Bedrooms
Popular

Lighthouse View

Perched on the bluff with unobstructed views of the lighthouse and the open Atlantic beyond.

Bluff 3 Bedrooms

Sea Glass Studio

A cozy one-room studio above the boathouse. Floor-to-ceiling windows and an outdoor shower.

Studio Harbor

Driftwood Retreat

Tucked behind the dunes, surrounded by beach plum and bayberry. A writing desk faces the morning sun.

07

Alerts & Notices

Gentle notifications in the palette of the shore. Never jarring, always informative.

Tide Advisory

High tide at 3:42 PM today. Beach access via the north stairs will be limited.

Reservation Confirmed

Your stay at Sandpiper Cove is booked for June 12-19. Check-in begins at 3 PM.

Storm Watch

A nor'easter is expected Friday evening. Outdoor furniture will be secured by staff.

Booking Unavailable

Lighthouse View is fully reserved for the selected dates. Please try another week.

08

Navigation

Wayfinding that feels natural and uncluttered, like following a path through the dunes.

09

Tables

Organized data with the clean feel of a captain's log.

Cottage Bedrooms View Rate Status
Sandpiper Cove 2 Oceanfront $185/night Available
Lighthouse View 3 Bluff & Lighthouse $240/night Booked
Sea Glass Studio Studio Harbor $120/night Available
Driftwood Retreat 1 Dunes $155/night Last Room

10

Blockquotes

Pull quotes and testimonials styled like found poetry on the shore.

"The cure for anything is salt water: sweat, tears, or the sea." — Isak Dinesen
"We left the windows open all night and fell asleep to the sound of the waves. In the morning, the whole cottage smelled like the ocean." — Guest Review, Sandpiper Cove

11

Design Principles

The philosophy behind the coastal cottage aesthetic.

🌊

Breathable Space

Leave room. Like the wide horizon at the beach, generous whitespace lets content breathe and reduces visual stress.

🪶

Weathered Warmth

Nothing is too polished. Soft corners, muted colors, and gentle textures create a space that feels lived-in and loved.

🌞

Natural Light

The palette is driven by daylight: pale skies, bright whites, and the way afternoon sun turns everything golden.

🚢

Quiet Nautical

Coastal, not naval. Rope textures and anchor motifs are used sparingly. The ocean is a neighbor, not a theme park.