Palette

Artisan Bread Crust

Warm, comforting browns and tans recall the perfectly baked crust of a freshly made artisan loaf.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Artisan Bread Crust 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 Bread Crust.

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

Data visualization

#D2B48C#8B4513#BC8F8F#CD853F#F5DEB3

Palette guide

How to use Artisan Bread Crust

Overview

The Artisan Bread Crust palette evokes the comforting warmth of freshly baked goods, featuring rich browns and soft tans. With colors like #D2B48C, #8B4513, #BC8F8F, #CD853F, and #F5DEB3, this collection is deeply rooted in natural, rustic aesthetics. It's perfect for designs that aim to convey coziness, authenticity, and a homemade feel. Designers can use these hues to create inviting digital spaces, appealing food packaging, or warm, earthy branding that resonates with comfort and tradition.

Best used for

Bakeries and coffee shop branding
Rustic and natural food packaging
Cozy interior design mood boards
Farm-to-table restaurant websites
Lifestyle blogs with a natural aesthetic
Autumnal and seasonal marketing campaigns

Suggested color roles

primary

Use #CD853F as a welcoming, central hue for main headers or key visual elements, embodying warmth.

secondary

Apply #D2B48C for supporting elements, like card backgrounds or softer section fills, providing a gentle tan.

accent

Incorporate #BC8F8F for subtle, warm accents, adding a hint of baked reddish-brown to buttons or highlights.

background

Utilize #F5DEB3 for primary backgrounds to offer a light, airy, and creamy base that enhances other colors.

text

Employ #8B4513 for body text on lighter backgrounds, ensuring excellent readability with a deep, earthy brown.

Accessibility notes

Ensure #8B4513 provides sufficient contrast for body text on #F5DEB3 or #D2B48C.
Be cautious when using #BC8F8F for small text, always check its contrast ratio.
Consider using a slightly darker charcoal for very small print if #8B4513 feels too light.
Larger headings can utilize #CD853F, but ensure it stands out against the chosen background.

Recommended combinations

Light & Rich

Perfect for a comforting interface, with a light base, a mid-tone for content, and a deep brown for clear text.

#F5DEB3 · #D2B48C · #8B4513

Warm Rustic

Ideal for conveying a homemade or artisanal feel, great for product labels or accent areas.

#CD853F · #BC8F8F · #8B4513

Earthy Blend

Creates a harmonious and inviting gradient, suitable for backgrounds with depth or subtle graphic elements.

#D2B48C · #CD853F · #F5DEB3

CSS variables

:root {
  --artisan-bread-crust-1: #D2B48C;
  --artisan-bread-crust-2: #8B4513;
  --artisan-bread-crust-3: #BC8F8F;
  --artisan-bread-crust-4: #CD853F;
  --artisan-bread-crust-5: #F5DEB3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "artisan-bread-crust": {
        1: "#D2B48C",
        2: "#8B4513",
        3: "#BC8F8F",
        4: "#CD853F",
        5: "#F5DEB3",
      }
    }
  }
}

Hex values

Color 1#D2B48C

Color 2#8B4513

Color 3#BC8F8F

Color 4#CD853F

Color 5#F5DEB3

Accessibility

Contrast checker

3.6:1AA18

1.4:1Fail

1.5:1Fail

3.6:1AA18

2.5:1Fail

2.4:1Fail

5.4:1AA

1.4:1Fail

2.5:1Fail

1.1:1Fail

2.1:1Fail

1.5:1Fail

2.4:1Fail

1.1:1Fail

2.3:1Fail

1.5:1Fail

5.4:1AA

2.1:1Fail

2.3:1Fail

Similar palettes

More like Artisan Bread Crust

Artisan Bread Crust

See it in context.

Ready when you are.

Built with Artisan Bread Crust.

How to use Artisan Bread Crust

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Light & Rich

Warm Rustic

Earthy Blend

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Artisan Bread Crust