Back to palettes

Palette

Ocean Driftwood Aged

Soft, muted tones reflecting driftwood weathered by endless ocean currents and time.

coolnatural5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ocean Driftwood Aged 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 Ocean Driftwood Aged.

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

Data visualization

#B0C4DE#778899#D3D3D3#5F9EA0#9FB3C3

Palette guide

How to use Ocean Driftwood Aged

Overview

The Ocean Driftwood Aged palette presents a collection of soft, muted tones that perfectly evoke the calm, weathered aesthetic of driftwood shaped by ocean currents. Featuring a gentle blend of blues and grays, including the serene #B0C4DE (Light Steel Blue), the grounding #778899 (Light Slate Gray), the neutral #D3D3D3 (Light Gray), the subtle #5F9EA0 (Cadet Blue), and the sophisticated #9FB3C3 (Slate Gray). This palette is excellent for designers and developers aiming to create a natural, tranquil, and timeless atmosphere. Its understated elegance makes it suitable for projects that require a sense of history, authenticity, or quiet sophistication without being overtly vibrant.

Best used for

  • Coastal home decor websites
  • Sustainable brand identities
  • Photography portfolios
  • Spa and wellness marketing materials
  • Artisan craft e-commerce stores
  • Environmental conservation non-profits

Suggested color roles

primary

#B0C4DE or #9FB3C3 can serve as a calming primary background, establishing a soft, inviting feel.

secondary

Use #778899 for subheadings, navigation, or to add a slightly darker, grounding element.

accent

#5F9EA0 provides a subtle, calming accent color, ideal for interactive elements or delicate highlights.

background

#D3D3D3 offers a clean, neutral background, while #B0C4DE can provide a soft, cool base.

text

For light backgrounds like #D3D3D3 or #B0C4DE, a dark gray like #778899 or even charcoal black would ensure readability.

Accessibility notes

  • Pay close attention to contrast, especially between #B0C4DE and #9FB3C3 or #778899 for text and interactive elements.
  • #D3D3D3 on #B0C4DE will have very low contrast; avoid using them together for critical information.
  • Use a darker text color (e.g., charcoal or black) on lighter shades like #D3D3D3, #B0C4DE, and #9FB3C3.
  • Ensure interactive elements have sufficient visual distinction beyond color alone due to the palette's muted nature.

Recommended combinations

Weathered Coast

Ideal for creating a soft, natural background with clear, readable text and subtle depth.

#B0C4DE · #778899 · #D3D3D3

Subtle Serenity

Perfect for minimalist designs, offering gentle accents and a sophisticated, calm feel.

#D3D3D3 · #5F9EA0 · #9FB3C3

Driftwood Harmony

Suited for layered interfaces or content blocks, providing a balanced and cohesive look.

#778899 · #B0C4DE · #5F9EA0

CSS variables

:root {
  --ocean-driftwood-aged-1: #B0C4DE;
  --ocean-driftwood-aged-2: #778899;
  --ocean-driftwood-aged-3: #D3D3D3;
  --ocean-driftwood-aged-4: #5F9EA0;
  --ocean-driftwood-aged-5: #9FB3C3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ocean-driftwood-aged": {
        1: "#B0C4DE",
        2: "#778899",
        3: "#D3D3D3",
        4: "#5F9EA0",
        5: "#9FB3C3",
      }
    }
  }
}

Related searches

muted coastal color palettenatural grey blue schemetranquil web design colorsaged wood aesthetic paletteserene neutral brand identity

Palette colors

Hex values

Color 1#B0C4DE
·
Color 2#778899
·
Color 3#D3D3D3
·
Color 4#5F9EA0
·
Color 5#9FB3C3
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
1.2:1Fail
1.7:1Fail
1.2:1Fail
2
2:1Fail
2.4:1Fail
1.2:1Fail
1.7:1Fail
3
1.2:1Fail
2.4:1Fail
2:1Fail
1.4:1Fail
4
1.7:1Fail
1.2:1Fail
2:1Fail
1.4:1Fail
5
1.2:1Fail
1.7:1Fail
1.4:1Fail
1.4:1Fail

Similar palettes

More like Ocean Driftwood Aged

View all cool