Back to palettes

Palette

Willow Weave

Earthy beiges and soft browns mimic the natural fibers and rustic charm of a woven basket.

neutralnatural5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Willow Weave 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 Willow Weave.

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

Data visualization

#D2B48C#B09F7D#8C7C65#A38B6E#F5DEB3

Palette guide

How to use Willow Weave

Overview

The Willow Weave palette draws inspiration from the natural fibers and rustic charm of woven baskets, featuring a collection of earthy beiges and soft browns. This warm and neutral scheme includes a light Tan (#D2B48C), a muted Khaki Brown (#B09F7D), a deep Dark Brown (#8C7C65), a medium Sepia Brown (#A38B6E), and a creamy Pale Yellow-beige (#F5DEB3). It's an excellent choice for designers aiming to evoke a sense of warmth, authenticity, and handcrafted quality. The harmonious blend of natural tones makes it versatile for projects that require a grounded, organic, and timeless aesthetic.

Best used for

  • Craft and artisan product branding
  • Natural cosmetic and skincare packaging
  • Rustic home goods and interior decor
  • Coffee shop and bakery branding
  • Eco-conscious and sustainable fashion
  • Websites with an organic or vintage feel

Suggested color roles

primary

Utilize #8C7C65 (Dark Brown) for foundational elements, bold headings, or a strong brand anchor, conveying stability and earthiness.

secondary

Apply #A38B6E (Sepia Brown) for supporting content, subheadings, or background textures, adding warmth and depth.

accent

Introduce #D2B48C (Tan) for highlights, subtle icons, or interactive elements to add a touch of natural brightness.

background

Use #F5DEB3 (Pale Yellow-beige) for clean, expansive backgrounds, creating a light and inviting canvas.

text

For optimal readability, use a dark brown (#8C7C65), black, or charcoal on lighter backgrounds, and white text on #8C7C65.

Accessibility notes

  • Ensure high contrast for text on #D2B48C (Tan) and #F5DEB3 (Pale Yellow-beige); dark text is essential.
  • Validate text readability for #B09F7D (Khaki Brown) on various backgrounds, especially white, where it might lack sufficient contrast.
  • When using #8C7C65 (Dark Brown) for backgrounds, white or very light text is crucial for clear legibility.
  • Avoid using lighter browns for small text on similarly light backgrounds to prevent readability issues.

Recommended combinations

Earthy Depth

Ideal for creating rich, layered backgrounds or graphic elements, evoking the natural depth of wood or woven materials.

#8C7C65 · #A38B6E · #B09F7D

Rustic Glow

Excellent for highlights or light accents, combining pale beige with tan and a medium brown for warmth and softness.

#F5DEB3 · #D2B48C · #A38B6E

Woven Texture

Perfect for subtle branding elements or UI components, creating a balanced and harmonious natural aesthetic.

#B09F7D · #D2B48C · #8C7C65

CSS variables

:root {
  --willow-weave-1: #D2B48C;
  --willow-weave-2: #B09F7D;
  --willow-weave-3: #8C7C65;
  --willow-weave-4: #A38B6E;
  --willow-weave-5: #F5DEB3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "willow-weave": {
        1: "#D2B48C",
        2: "#B09F7D",
        3: "#8C7C65",
        4: "#A38B6E",
        5: "#F5DEB3",
      }
    }
  }
}

Related searches

earthy beige color palettenatural brown design colorsrustic weave themeneutral warm tones palettehandcrafted brand inspiration

Palette colors

Hex values

Color 1#D2B48C
·
Color 2#B09F7D
·
Color 3#8C7C65
·
Color 4#A38B6E
·
Color 5#F5DEB3
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
2.1:1Fail
1.6:1Fail
1.5:1Fail
2
1.3:1Fail
1.6:1Fail
1.3:1Fail
2:1Fail
3
2.1:1Fail
1.6:1Fail
1.2:1Fail
3.1:1AA18
4
1.6:1Fail
1.3:1Fail
1.2:1Fail
2.5:1Fail
5
1.5:1Fail
2:1Fail
3.1:1AA18
2.5:1Fail

Similar palettes

More like Willow Weave

View all neutral