Palette

Quarry Stone Textures

A rugged yet harmonious blend of browns and grays, capturing the raw beauty of natural quarry stones.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Quarry Stone Textures 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 Quarry Stone Textures.

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

Data visualization

#8B4513#A9A9A9#BDB76B#696969#D2B48C

Palette guide

How to use Quarry Stone Textures

Overview

The "Quarry Stone Textures" palette is a rustic and earthy collection, capturing the raw beauty of natural stones and mineral deposits. It features a grounding #8B4513 (saddle brown) alongside a warm #D2B48C (tan), complemented by classic greys: #A9A9A9 (dark gray) and a deeper #696969 (dim gray). A unique #BDB76B (dark khaki) adds an unexpected, organic touch, reminiscent of moss or subtle mineral blooms. This palette is perfect for designers and developers aiming for an authentic, natural, and rugged aesthetic. It's ideal for projects that require an organic, unrefined feel, such as outdoor brands, artisanal crafts, or environmental themes.

Best used for

Outdoor adventure brand identity
Rustic lodge or cabin website design
Handmade craft e-commerce stores
Environmental education materials
Natural skincare product packaging
Historical or heritage site presentations

Suggested color roles

primary

This deep saddle brown #8B4513 offers a strong, earthy anchor for main headings, calls-to-action, or a dominant brand color.

secondary

Dim gray #696969 provides a versatile, grounded secondary color, suitable for subheadings, navigation, or structural elements.

accent

Dark khaki #BDB76B adds an organic, subtle accent, perfect for decorative elements, highlights, or graphical textures.

background

Tan #D2B48C serves as a warm, neutral, and inviting background, providing a soft canvas for content and other colors.

text

Dim gray #696969 or saddle brown #8B4513 offers excellent readability against lighter backgrounds like #D2B48C, ideal for body text and links, or a true black.

Accessibility notes

Ensure strong contrast for text using #696969 or #8B4513 against #D2B48C backgrounds.
Avoid using #A9A9A9 or #BDB76B as text colors on #D2B48C due to insufficient contrast.
Verify all text and interactive elements meet WCAG AA or AAA contrast guidelines.
For critical information or small text, use the darkest colors for maximum legibility.

Recommended combinations

Earthy Foundation

Creates a robust, natural feel, excellent for primary branding and content blocks.

#8B4513 · #D2B48C · #696969

Stone Blend

Provides a softer, organic aesthetic, suitable for secondary information, backgrounds, or decorative elements.

#A9A9A9 · #BDB76B · #D2B48C

Rustic Contrast

Offers a grounded and inviting look with good contrast, perfect for navigation or footers.

#696969 · #D2B48C · #8B4513

CSS variables

:root {
  --quarry-stone-textures-1: #8B4513;
  --quarry-stone-textures-2: #A9A9A9;
  --quarry-stone-textures-3: #BDB76B;
  --quarry-stone-textures-4: #696969;
  --quarry-stone-textures-5: #D2B48C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "quarry-stone-textures": {
        1: "#8B4513",
        2: "#A9A9A9",
        3: "#BDB76B",
        4: "#696969",
        5: "#D2B48C",
      }
    }
  }
}

Hex values

Color 1#8B4513

Color 2#A9A9A9

Color 3#BDB76B

Color 4#696969

Color 5#D2B48C

Accessibility

Contrast checker

3:1AA18

3.4:1AA18

1.3:1Fail

3.6:1AA18

3:1AA18

1.1:1Fail

2.3:1Fail

1.2:1Fail

3.4:1AA18

1.1:1Fail

2.7:1Fail

1:1Fail

1.3:1Fail

2.3:1Fail

2.7:1Fail

2.8:1Fail

3.6:1AA18

1.2:1Fail

1:1Fail

2.8:1Fail

Similar palettes

More like Quarry Stone Textures

View all earth

Ancient Stone Path

Archaeological Dig Earth

Mediterranean Stone House

Aegean Faded Fresco

Aged Leather Comfort

Aged Manuscript Bindings