Back to palettes

Palette

Muted Linen Serene

Tranquil and understated, this palette captures the serene and inviting texture of muted linen fabrics.

neutralcalm5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Muted Linen Serene 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 Muted Linen Serene.

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

Data visualization

#FDF5E6#FAFAD2#F5DEB3#F0E68C#D2B48C

Palette guide

How to use Muted Linen Serene

Overview

The Muted Linen Serene palette is tranquil and understated, capturing the inviting texture of muted linen fabrics. It offers a range of warm neutrals, from the softest cream (#FDF5E6) to a grounding tan (#D2B48C), including a pale yellow (#F0E68C) and a warm beige (#F5DEB3). This collection is ideal for designers and developers aiming to create organic, calm, and comforting experiences. It excels in conveying natural elegance and tactile warmth, perfect for applications where a soft, unpretentious aesthetic is desired.

Best used for

  • Eco-friendly and sustainable brand identities
  • Natural textile and fabric product lines
  • Spa, yoga, and wellness studio branding
  • Cozy cafe and bakery websites
  • Organic food product packaging
  • Minimalist interior design concepts

Suggested color roles

primary

Use #F5DEB3 (warm beige) as an inviting primary color for content sections or soft interactive elements.

secondary

Employ #D2B48C (deeper tan) for subheadings, navigation, or to add grounding depth to layouts.

accent

Incorporate #F0E68C (subtle pale yellow) for delicate highlights, subtle call-to-action buttons, or decorative accents.

background

Select #FDF5E6 (softest cream) as an airy, clean backdrop that allows other colors to maintain their gentle warmth.

text

Opt for #D2B48C (mid-tone tan) for body text, ensuring readable contrast and a cohesive natural aesthetic.

Accessibility notes

  • Ensure high contrast for text, as many colors in this palette are light. #FDF5E6 and #FAFAD2 require dark text.
  • Pair #FDF5E6 and #FAFAD2 with a dark text color like #D2B48C or a deep brown for optimal readability.
  • Avoid using #F0E68C for small text on #FAFAD2; it's better suited for larger decorative elements.
  • The darkest color, #D2B48C, provides reliable contrast for text against all lighter shades in the palette.

Recommended combinations

Natural Depth

Creates a warm, layered effect suitable for headers, footers, or distinct content blocks.

#D2B48C · #F5DEB3 · #FDF5E6

Subtle Warmth

Ideal for serene backgrounds, subtle gradients, or soft graphical elements, evoking gentle warmth.

#FAFAD2 · #F0E68C · #F5DEB3

Linen Base

Perfect for clean, readable body text on a very light background, conveying organic simplicity.

#FDF5E6 · #D2B48C · #F5DEB3

CSS variables

:root {
  --muted-linen-serene-1: #FDF5E6;
  --muted-linen-serene-2: #FAFAD2;
  --muted-linen-serene-3: #F5DEB3;
  --muted-linen-serene-4: #F0E68C;
  --muted-linen-serene-5: #D2B48C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "muted-linen-serene": {
        1: "#FDF5E6",
        2: "#FAFAD2",
        3: "#F5DEB3",
        4: "#F0E68C",
        5: "#D2B48C",
      }
    }
  }
}

Related searches

muted linen colorsserene beige palettenatural fabric huestranquil tan creamorganic neutral design

Palette colors

Hex values

Color 1#FDF5E6
·
Color 2#FAFAD2
·
Color 3#F5DEB3
·
Color 4#F0E68C
·
Color 5#D2B48C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1:1Fail
1.2:1Fail
1.2:1Fail
1.8:1Fail
2
1:1Fail
1.2:1Fail
1.2:1Fail
1.8:1Fail
3
1.2:1Fail
1.2:1Fail
1:1Fail
1.5:1Fail
4
1.2:1Fail
1.2:1Fail
1:1Fail
1.5:1Fail
5
1.8:1Fail
1.8:1Fail
1.5:1Fail
1.5:1Fail

Similar palettes

More like Muted Linen Serene

View all neutral
Coastal Driftwood Sands
Coastal Dune Whispers
Gentle Wave Wash
Jade Tea Ritual
Seaside Linen Comfort
Summer Linen Dream