Back to palettes

Palette

Woven Basket Weave

Earthy browns and light tans, reminiscent of natural fibers and handcrafted woven baskets.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#A0522D#D2B48C#F5DEB3#CD853F#8B4513

Palette guide

How to use Woven Basket Weave

Overview

The Woven Basket Weave palette beautifully captures the warm, inviting essence of natural fibers and handcrafted artistry. It features a rich, deep brown #8B4513, reminiscent of sturdy reeds, and a vibrant, earthy #A0522D. Brighter, golden tones like #CD853F add a sun-kissed quality, while #D2B48C and the delicate, near-white #F5DEB3 provide excellent contrast and a sense of lightness. This palette is highly effective for designers and developers aiming to create authentic, cozy, and natural experiences. It's ideal for projects celebrating artisanal craftsmanship, rustic charm, and the subtle variations found in hand-woven materials.

Best used for

  • Artisanal craft websites
  • Rustic home decor branding
  • Farm-to-fork culinary experiences
  • Outdoor-inspired product lines
  • Sustainable fashion accessories
  • Cozy cafe or bakery aesthetics

Suggested color roles

primary

#8B4513 - A deep, robust brown, excellent for strong brand elements, main headings, or foundational UI.

secondary

#A0522D - A rich, warm reddish-brown, ideal for subheadings, navigation, or significant content blocks.

accent

#CD853F - A brighter, golden-orange brown, perfect for interactive elements, calls to action, or vibrant highlights.

background

#F5DEB3 - A delicate, near-white cream that provides a clean, breathable canvas, enhancing the natural feel.

text

#8B4513 - Offers strong contrast on light backgrounds like #F5DEB3. For darker backgrounds, use white or a very light cream.

Accessibility notes

  • Ensure #8B4513 text on #F5DEB3 background meets WCAG AAA contrast standards.
  • Avoid using #D2B48C directly on #F5DEB3 for small text to prevent low contrast.
  • All interactive elements should have clear visual feedback for hover and focus states.
  • For optimal readability, ensure sufficient line height when using mid-tones for body text.

Recommended combinations

Rustic Foundation

A strong base, a warm mid-tone, and a bright background for clear, rustic design.

#8B4513 · #A0522D · #F5DEB3

Golden Weave

Creates depth and vibrancy, ideal for hero sections or engaging UI elements.

#A0522D · #CD853F · #8B4513

Light Craft

Excellent for soft gradients, background patterns, or subtle, inviting transitions.

#D2B48C · #F5DEB3 · #CD853F

CSS variables

:root {
  --woven-basket-weave-2-1: #A0522D;
  --woven-basket-weave-2-2: #D2B48C;
  --woven-basket-weave-2-3: #F5DEB3;
  --woven-basket-weave-2-4: #CD853F;
  --woven-basket-weave-2-5: #8B4513;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "woven-basket-weave-2": {
        1: "#A0522D",
        2: "#D2B48C",
        3: "#F5DEB3",
        4: "#CD853F",
        5: "#8B4513",
      }
    }
  }
}

Related searches

rustic brown color palettenatural woven textureswarm craft aestheticearthy tan colorshandmade design scheme

Palette colors

Hex values

Color 1#A0522D
·
Color 2#D2B48C
·
Color 3#F5DEB3
·
Color 4#CD853F
·
Color 5#8B4513
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.8:1Fail
4.3:1AA18
1.9:1Fail
1.3:1Fail
2
2.8:1Fail
1.5:1Fail
1.5:1Fail
3.6:1AA18
3
4.3:1AA18
1.5:1Fail
2.3:1Fail
5.4:1AA
4
1.9:1Fail
1.5:1Fail
2.3:1Fail
2.4:1Fail
5
1.3:1Fail
3.6:1AA18
5.4:1AA
2.4:1Fail

Similar palettes

More like Woven Basket Weave

View all earth