Back to palettes

Palette

Seaside Driftwood Whisper

Soft, muted tones reflecting sun-bleached driftwood and pebbles found along a quiet shoreline.

neutralnatural5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#D3D3D3#A9A9A9#696969#8B4513#B0C4DE

Palette guide

How to use Seaside Driftwood Whisper

Overview

The "Seaside Driftwood Whisper" palette features soft, muted tones reflecting sun-bleached driftwood and pebbles found along a quiet shoreline. This versatile palette includes cool grays like #D3D3D3, #A9A9A9, and #696969, a deep brown #8B4513, and a subtle blue #B0C4DE. It's perfect for designers aiming to create a natural, calm, and slightly rustic aesthetic, reminiscent of a peaceful, weathered coastal environment. This collection is excellent for both digital and print media, offering a sense of grounded tranquility and organic elegance.

Best used for

  • Rustic farmhouse decor and styling
  • Outdoor adventure branding
  • Historical preservation projects
  • Natural beauty product packaging
  • Calming digital interfaces and apps
  • Weathered photography themes

Suggested color roles

primary

Use #D3D3D3 for a clean, light background, providing a fresh and expansive base.

secondary

Apply #A9A9A9 for content blocks, subtle patterns, or secondary navigation elements.

accent

Utilize #8B4513 for strong calls to action, important highlights, or a warm, earthy contrast.

background

Employ #D3D3D3, establishing a light and airy foundational canvas.

text

For primary body text, use #696969, ensuring clear readability and a sophisticated look.

Accessibility notes

  • Use #696969 or #8B4513 for text on #D3D3D3 and #A9A9A9 for good contrast and readability.
  • Ensure #B0C4DE is not used for small text on light backgrounds without checking contrast ratios.
  • Headings in #8B4513 will provide good visual weight and stand out well on lighter shades.
  • Avoid using light text on #696969 without sufficient contrast, especially for critical information.

Recommended combinations

Coastal Calm

Ideal for light web layouts, subtle branding, and serene digital experiences.

#D3D3D3 · #A9A9A9 · #B0C4DE

Rustic Depth

Combine for clear text on a light background, with a strong brown accent for emphasis.

#D3D3D3 · #8B4513 · #696969

Balanced Shoreline

Effective for layered UI components, nuanced elements, and a touch of serene blue.

#A9A9A9 · #696969 · #B0C4DE

CSS variables

:root {
  --seaside-driftwood-whisper-1: #D3D3D3;
  --seaside-driftwood-whisper-2: #A9A9A9;
  --seaside-driftwood-whisper-3: #696969;
  --seaside-driftwood-whisper-4: #8B4513;
  --seaside-driftwood-whisper-5: #B0C4DE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "seaside-driftwood-whisper": {
        1: "#D3D3D3",
        2: "#A9A9A9",
        3: "#696969",
        4: "#8B4513",
        5: "#B0C4DE",
      }
    }
  }
}

Related searches

driftwood grey paletterustic coastal colorsweathered beach designcalm neutral bluenatural wood tones

Palette colors

Hex values

Color 1#D3D3D3
·
Color 2#A9A9A9
·
Color 3#696969
·
Color 4#8B4513
·
Color 5#B0C4DE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
3.7:1AA18
4.7:1AA
1.2:1Fail
2
1.6:1Fail
2.3:1Fail
3:1AA18
1.3:1Fail
3
3.7:1AA18
2.3:1Fail
1.3:1Fail
3.1:1AA18
4
4.7:1AA
3:1AA18
1.3:1Fail
4:1AA18
5
1.2:1Fail
1.3:1Fail
3.1:1AA18
4:1AA18

Similar palettes

More like Seaside Driftwood Whisper

View all neutral