Palette

Artisan Loom Threads

Textured hues reminiscent of hand-woven fabrics, blending earthy browns with subtle blues and greens.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Artisan Loom Threads 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 Artisan Loom Threads.

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

Data visualization

#CD853F#B0C4DE#D2B48C#A9A9A9#8FBC8F

Palette guide

How to use Artisan Loom Threads

Overview

The Artisan Loom Threads palette features textured hues reminiscent of hand-woven fabrics, blending earthy browns with subtle blues and greens. With colors like #CD853F, #B0C4DE, #D2B48C, #A9A9A9, and #8FBC8F, this collection exudes a natural, bohemian charm and artisanal quality. It's ideal for designers seeking to convey authenticity, craftsmanship, and a connection to natural textiles. These versatile tones are perfect for creating inviting digital spaces, appealing product packaging, and evocative visual narratives that celebrate handmade artistry.

Best used for

Textile and fabric brands
Bohemian home decor and fashion
Artisan craft and handmade product branding
Natural beauty and organic product packaging
Creative workshops and art education
Earthy web design and blogs

Suggested color roles

primary

Use #CD853F as a warm, earthy primary color for headlines or key visual elements, embodying natural fibers.

secondary

Apply #B0C4DE for a soft, calming blue secondary hue, suitable for backgrounds or subtle graphic elements, offering serenity.

accent

Incorporate #8FBC8F for a muted, natural green accent, perfect for calls to action or important details that require gentle emphasis.

background

Utilize #D2B48C for primary backgrounds, providing a soft, warm tan, and expansive base that enhances other colors.

text

Employ #A9A9A9 for body text on lighter backgrounds, ensuring readability with a versatile mid-grey. For stronger contrast, a dark charcoal or black is recommended.

Accessibility notes

Ensure #A9A9A9 or a darker charcoal provides strong contrast for all text on #D2B48C backgrounds.
Be cautious when using #B0C4DE or #8FBC8F for small text, as their mid-tone values might lead to lower contrast.
Always test color combinations to meet WCAG contrast guidelines, especially for interactive elements.
For critical information, prioritize higher contrast pairings, possibly with a neutral white background not in the palette.

Recommended combinations

Earthy Textile

An excellent combination for main content areas, providing a clear visual hierarchy from a light background to warm headings and text.

#D2B48C · #CD853F · #A9A9A9

Boho Weave

Ideal for creating depth and visual interest in graphic elements, illustrations, or feature sections, showcasing diverse natural tones.

#B0C4DE · #8FBC8F · #CD853F

Natural Contrast

Suitable for harmonious layered backgrounds or subtle visual elements that require a gentle transition, maintaining softness and depth.

#D2B48C · #B0C4DE · #A9A9A9

CSS variables

:root {
  --artisan-loom-threads-1: #CD853F;
  --artisan-loom-threads-2: #B0C4DE;
  --artisan-loom-threads-3: #D2B48C;
  --artisan-loom-threads-4: #A9A9A9;
  --artisan-loom-threads-5: #8FBC8F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "artisan-loom-threads": {
        1: "#CD853F",
        2: "#B0C4DE",
        3: "#D2B48C",
        4: "#A9A9A9",
        5: "#8FBC8F",
      }
    }
  }
}

Hex values

Color 1#CD853F

Color 2#B0C4DE

Color 3#D2B48C

Color 4#A9A9A9

Color 5#8FBC8F

Accessibility

Contrast checker

1.7:1Fail

1.5:1Fail

1.3:1Fail

1.4:1Fail

1.7:1Fail

1.1:1Fail

1.3:1Fail

1.2:1Fail

1.5:1Fail

1.1:1Fail

1.2:1Fail

1.1:1Fail

1.3:1Fail

1.2:1Fail

1.1:1Fail

1.4:1Fail

1.2:1Fail

1.1:1Fail

Similar palettes

More like Artisan Loom Threads

Artisan Loom Threads

See it in context.

Ready when you are.

Built with Artisan Loom Threads.

How to use Artisan Loom Threads

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Earthy Textile

Boho Weave

Natural Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Artisan Loom Threads