Palette

Seaside Driftwood Muted

Subdued, earthy tones echoing weathered wood and serene, sandy beaches by a calm sea.

neutralcalm5 colors

More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Seaside Driftwood Muted 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 Seaside Driftwood Muted.

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

Data visualization

#9C8C7D#BFB0A3#E0D4C7#6D5E52#B0A193

Palette guide

How to use Seaside Driftwood Muted

Overview

The "Seaside Driftwood Muted" palette offers a collection of subdued, earthy tones that evoke the serene beauty of weathered wood and calm, sandy beaches. Featuring shades like the light #E0D4C7, the warm #BFB0A3, and the deep #6D5E52, this palette is perfect for creating a natural, tranquil, and sophisticated atmosphere. It's ideal for designers seeking a grounded yet airy feel, reminiscent of a peaceful coastal landscape. This versatile palette is excellent for both digital and print media, providing a sense of calm and organic elegance.

Best used for

Beach house interior design
Organic skincare branding
Mindful living blogs and websites
Rustic wedding themes and stationery
Calming digital interfaces and apps
Natural home goods marketing

Suggested color roles

primary

Use #E0D4C7 for a soft, inviting background, reminiscent of sand on a quiet shore.

secondary

Apply #BFB0A3 for content cards, navigation elements, or secondary sections.

accent

Utilize #9C8C7D for subtle highlights, borders, or interactive elements, adding gentle definition.

background

Employ #E0D4C7 to provide a light, serene, and natural foundational base.

text

For main body text, use #6D5E52, ensuring excellent legibility and a sophisticated look.

Accessibility notes

Use #6D5E52 for body text on #E0D4C7 or #BFB0A3 for strong contrast and readability.
Be cautious with #B0A193 as text on lighter backgrounds; always check contrast ratios.
Ensure all interactive elements have sufficient contrast with their backgrounds for usability.
Avoid using light text on #9C8C7D without verifying readability, especially for small fonts.

Recommended combinations

Sandy Base

Ideal for light, airy web pages, natural product displays, and soft branding.

#E0D4C7 · #BFB0A3 · #B0A193

Deep Wood

Combine for strong headings, impactful accents, and contrasting elements on a light base.

#6D5E52 · #9C8C7D · #E0D4C7

Muted Harmony

Effective for layered UI components, subtle gradients, and nuanced visual depth.

#BFB0A3 · #B0A193 · #6D5E52

CSS variables

:root {
  --seaside-driftwood-muted-1: #9C8C7D;
  --seaside-driftwood-muted-2: #BFB0A3;
  --seaside-driftwood-muted-3: #E0D4C7;
  --seaside-driftwood-muted-4: #6D5E52;
  --seaside-driftwood-muted-5: #B0A193;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "seaside-driftwood-muted": {
        1: "#9C8C7D",
        2: "#BFB0A3",
        3: "#E0D4C7",
        4: "#6D5E52",
        5: "#B0A193",
      }
    }
  }
}

Hex values

Color 1#9C8C7D

Color 2#BFB0A3

Color 3#E0D4C7

Color 4#6D5E52

Color 5#B0A193

Accessibility

Contrast checker

1.5:1Fail

2.2:1Fail

1.9:1Fail

1.3:1Fail

1.5:1Fail

1.4:1Fail

3:1Fail

1.2:1Fail

2.2:1Fail

1.4:1Fail

4.3:1AA18

1.7:1Fail

1.9:1Fail

3:1Fail

4.3:1AA18

2.5:1Fail

1.3:1Fail

1.2:1Fail

1.7:1Fail

2.5:1Fail

Similar palettes

More like Seaside Driftwood Muted

View all neutral

Seafoam Driftwood Strand

Seaside Driftwood Calm

Seaside Driftwood Whisper

Ancient Grove Hush

Cloud Forest Mist

Coastal Driftwood Grey