Back to palettes

Palette

Coastal Linen Breeze

Soft, muted tones reflecting sun-bleached linen, sea foam, and distant ocean haze for a tranquil coastal feel.

neutralcalm5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Coastal Linen Breeze 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 Coastal Linen Breeze.

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

Data visualization

#E6E0D2#C2B8AA#8D98A1#5B7B8D#B7C3C5

Palette guide

How to use Coastal Linen Breeze

Overview

The Coastal Linen Breeze palette offers a harmonious blend of earthy neutrals and muted blues, evoking the tranquil feel of sun-bleached linen and a gentle ocean haze. With shades ranging from the warm #E6E0D2 to the deep blue-grey #5B7B8D, and including the versatile #C2B8AA, #8D98A1, and #B7C3C5. This palette is perfect for designs that prioritize natural elegance, calm, and an organic aesthetic. Developers will find these colors excellent for crafting eco-friendly branding, serene web interfaces, and inviting digital experiences that feel both grounded and airy.

Best used for

  • Eco-friendly and sustainable brands
  • Interior design and home decor websites
  • Natural product packaging
  • Calm and relaxed web interfaces
  • Textile and fabric design showcases
  • Mindfulness and wellness content

Suggested color roles

primary

Utilize #C2B8AA as a warm, inviting primary color for main sections, headers, or card backgrounds.

secondary

Employ #8D98A1 for secondary information, navigation, or to introduce a subtle, cool blue-grey contrast.

accent

Apply #5B7B8D sparingly for strong calls-to-action, important icons, or as a deep footer/header color to provide grounding.

background

The lightest shade, #E6E0D2, is ideal for expansive backgrounds, offering a soft, natural, and clean canvas.

text

For optimal readability on lighter backgrounds, use #5B7B8D or a dark brown like #4A4A4A to ensure clear text presentation.

Accessibility notes

  • Ensure #5B7B8D text has sufficient contrast against #E6E0D2 or #C2B8AA backgrounds.
  • Avoid using #C2B8AA for small text on #E6E0D2, as contrast may be too low for readability.
  • Always test all text and interactive elements with a WCAG contrast checker for compliance.
  • This palette's softer tones require careful contrast checks, especially for body text.

Recommended combinations

Earthy Calm

Excellent for layered content blocks or a soft background with complementary mid-tones.

#E6E0D2 · #C2B8AA · #8D98A1

Ocean Depth

Create a gradient or tiered UI elements that transition from lighter blue-grey to a deeper, more profound tone.

#B7C3C5 · #8D98A1 · #5B7B8D

Natural Contrast

Use a light background with a strong, grounding text color, balanced by a refreshing blue-grey accent.

#E6E0D2 · #5B7B8D · #B7C3C5

CSS variables

:root {
  --coastal-linen-breeze-1: #E6E0D2;
  --coastal-linen-breeze-2: #C2B8AA;
  --coastal-linen-breeze-3: #8D98A1;
  --coastal-linen-breeze-4: #5B7B8D;
  --coastal-linen-breeze-5: #B7C3C5;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "coastal-linen-breeze": {
        1: "#E6E0D2",
        2: "#C2B8AA",
        3: "#8D98A1",
        4: "#5B7B8D",
        5: "#B7C3C5",
      }
    }
  }
}

Related searches

linen color palettecoastal neutral bluenatural breeze schemeearthy serene colorsmuted organic tones

Palette colors

Hex values

Color 1#E6E0D2
·
Color 2#C2B8AA
·
Color 3#8D98A1
·
Color 4#5B7B8D
·
Color 5#B7C3C5
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.2:1Fail
3.4:1AA18
1.4:1Fail
2
1.5:1Fail
1.5:1Fail
2.3:1Fail
1.1:1Fail
3
2.2:1Fail
1.5:1Fail
1.5:1Fail
1.6:1Fail
4
3.4:1AA18
2.3:1Fail
1.5:1Fail
2.5:1Fail
5
1.4:1Fail
1.1:1Fail
1.6:1Fail
2.5:1Fail

Similar palettes

More like Coastal Linen Breeze

View all neutral
Arid Plains Vista
Coastal Driftwood Grey
Coastal Dune Serenity
Coastal Fog Whisper
Coastal Sands Aura
Coastal Shell Treasure