Back to palettes

Palette

Woven Fabric Hues

Soft, muted neutrals evoke the comforting texture and understated elegance of finely woven natural fabrics.

neutralminimal5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Woven Fabric Hues 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 Woven Fabric Hues.

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

Data visualization

#8C847E#B3ABA5#D9D4D0#6E6763#524D49

Palette guide

How to use Woven Fabric Hues

Overview

The "Woven Fabric Hues" palette offers a sophisticated range of soft, muted neutrals, evoking the comforting texture and understated elegance of finely woven natural fabrics. With hex codes like #524D49 (a deep, grounded charcoal-brown), #8C847E (a rich, warm grey), and #D9D4D0 (a light, airy off-white), this palette is perfect for designers seeking to create a minimalist, serene, and tactile aesthetic. Its harmonious blend of subtle tones provides versatility for both modern and classic designs, ideal for conveying quiet luxury or natural simplicity across various media.

Best used for

  • Minimalist fashion branding
  • Luxury home goods websites
  • Elegant editorial design
  • Sophisticated app interfaces
  • Textile-inspired art and prints
  • Serene corporate branding

Suggested color roles

primary

Use #524D49 as a deep, grounding charcoal-brown, excellent for brand logos, main headings, or strong foundational elements, conveying sophistication.

secondary

Apply #6E6763, a rich, deep grey, suitable for subheadings, navigation, or larger content areas, offering a muted yet refined presence.

accent

Utilize #8C847E, a warm, mid-tone grey, perfect for subtle highlights, interactive elements, or adding gentle visual interest.

background

Employ #D9D4D0, a very light, airy off-white, providing a clean, expansive, and tranquil canvas that complements the deeper tones.

text

For primary body text, use #524D49 or black, ensuring excellent readability against the lighter backgrounds.

Accessibility notes

  • Ensure #524D49 text on #D9D4D0 background meets WCAG AA contrast standards.
  • Avoid using #B3ABA5 for small text on #8C847E due to insufficient contrast.
  • Use #6E6763 for larger text elements or headings against lighter backgrounds for legibility.
  • Consider a very dark text color, like charcoal, for any copy placed on #B3ABA5.

Recommended combinations

Fabric Base

Creates a sophisticated, clean, and minimalist core aesthetic for branding or web foundations.

#524D49 · #D9D4D0 · #6E6763

Soft Layers

Ideal for adding subtle depth to UI elements, background patterns, or visual textures.

#8C847E · #B3ABA5 · #6E6763

Muted Elegance

Offers a balanced, serene, and understated visual appeal for refined designs.

#D9D4D0 · #B3ABA5 · #524D49

CSS variables

:root {
  --woven-fabric-hues-1: #8C847E;
  --woven-fabric-hues-2: #B3ABA5;
  --woven-fabric-hues-3: #D9D4D0;
  --woven-fabric-hues-4: #6E6763;
  --woven-fabric-hues-5: #524D49;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "woven-fabric-hues": {
        1: "#8C847E",
        2: "#B3ABA5",
        3: "#D9D4D0",
        4: "#6E6763",
        5: "#524D49",
      }
    }
  }
}

Related searches

muted neutral fabric paletteelegant grey beige schememinimalist textile colorssoft woven designunderstated luxury branding

Palette colors

Hex values

Color 1#8C847E
·
Color 2#B3ABA5
·
Color 3#D9D4D0
·
Color 4#6E6763
·
Color 5#524D49
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
1.5:1Fail
2.3:1Fail
2
1.6:1Fail
1.5:1Fail
2.5:1Fail
3.7:1AA18
3
2.5:1Fail
1.5:1Fail
3.8:1AA18
5.7:1AA
4
1.5:1Fail
2.5:1Fail
3.8:1AA18
1.5:1Fail
5
2.3:1Fail
3.7:1AA18
5.7:1AA
1.5:1Fail

Similar palettes

More like Woven Fabric Hues

View all neutral
Sun-Washed Linen
Cloud Cotton Comfort
Cloud Linen Texture
Cloud Soft Canvas
Cloud Veil Serene
Faded Canvas Memoir