Back to palettes

Palette

Ancient Stone

Reflects the timeworn beauty and subtle variations of ancient, weathered stone and aged structures.

earthminimal5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#795548#A1887F#BCAAA4#D7CCC8#5D4037

Palette guide

How to use Ancient Stone

Overview

The 'Ancient Stone' palette reflects the timeworn beauty and subtle variations of ancient, weathered stone and aged structures. With shades ranging from the deep #5D4037 to the light #D7CCC8, and including warm browns like #795548 and #A1887F, this earthy, brown, and rustic palette is perfect for designers and developers crafting natural, historic, and grounded designs. It provides a rich yet understated foundation for conveying heritage, natural textures, and a sense of enduring beauty in various digital and physical applications, from rustic interiors to documentary films.

Best used for

  • Rustic interior design concepts
  • Historical preservation projects
  • Natural material product lines
  • Artisanal crafts and handmade goods
  • Earthy branding and marketing
  • Documentary films on history and nature

Suggested color roles

primary

Utilize #795548 as a mid-tone, warm brown for primary elements, offering a balanced and natural foundation.

secondary

Apply #A1887F as a lighter, aged brown for supporting sections, subheadings, or subtle graphical accents, adding visual softness.

accent

Introduce #5D4037 as the deepest, grounding brown for impactful headlines, calls-to-action, or strong graphical elements, providing powerful contrast.

background

Employ #D7CCC8 as a soft, light beige background, offering a clean and expansive canvas with an earthy feel.

text

For optimal legibility, use #5D4037 for all body text and headings, ensuring strong contrast against lighter backgrounds like #D7CCC8.

Accessibility notes

  • Ensure #5D4037 text on #D7CCC8 background meets WCAG AA contrast standards for readability.
  • Use #795548 for larger headings on #BCAAA4 for good visual distinction.
  • Avoid using #A1887F for small text on #BCAAA4 due to potential low contrast.
  • Verify contrast for all interactive elements to ensure consistent legibility and usability.

Recommended combinations

Deep Stone

Creates a rich, layered depth suitable for prominent content blocks, footers, or deep textural backgrounds.

#5D4037 · #795548 · #A1887F

Weathered Wall

Ideal for layered backgrounds, subtle gradients, or overlays that evoke light, textured stone surfaces.

#A1887F · #BCAAA4 · #D7CCC8

Earthy Structure

A contrasting yet natural combination for titles, hero sections, or key informational graphics.

#795548 · #D7CCC8 · #5D4037

CSS variables

:root {
  --ancient-stone-1: #795548;
  --ancient-stone-2: #A1887F;
  --ancient-stone-3: #BCAAA4;
  --ancient-stone-4: #D7CCC8;
  --ancient-stone-5: #5D4037;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ancient-stone": {
        1: "#795548",
        2: "#A1887F",
        3: "#BCAAA4",
        4: "#D7CCC8",
        5: "#5D4037",
      }
    }
  }
}

Related searches

ancient stone brownearthy rustic paletteweathered historic hexnatural aged designtimeworn material colors

Palette colors

Hex values

Color 1#795548
·
Color 2#A1887F
·
Color 3#BCAAA4
·
Color 4#D7CCC8
·
Color 5#5D4037
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
2.9:1Fail
4.2:1AA18
1.4:1Fail
2
2:1Fail
1.5:1Fail
2.1:1Fail
2.8:1Fail
3
2.9:1Fail
1.5:1Fail
1.4:1Fail
4.2:1AA18
4
4.2:1AA18
2.1:1Fail
1.4:1Fail
5.9:1AA
5
1.4:1Fail
2.8:1Fail
4.2:1AA18
5.9:1AA

Similar palettes

More like Ancient Stone

View all earth
Earthen Pottery Glaze
Rammed Soil
Ancient Earth Whisper
Ancient Earth Whisper
Ancient Ruins Dust
Artisan Ceramic Glaze