Back to palettes

Palette

Sunbaked Clay

Warm, earthy tones reminiscent of sun-drenched terracotta and traditional adobe dwellings.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sunbaked Clay 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 Sunbaked Clay.

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

Data visualization

#D77F5B#F6AA96#EBDBC8#BB9B84#A26E57

Palette guide

How to use Sunbaked Clay

Overview

The Sunbaked Clay palette combines the rustic charm of terracotta with serene, sandy neutrals, creating a warm and grounded aesthetic. This collection ranges from the vibrant #D77F5B to the soft, airy #EBDBC8, echoing sun-drenched landscapes and traditional adobe structures. The earthy brown of #A26E57 provides a deep anchor, while #BB9B84 offers a versatile mid-tone. Designers and developers can leverage this palette to craft inviting, authentic, and naturally elegant experiences, perfect for brands that value organic beauty, artisanal craftsmanship, and a sense of timeless warmth.

Best used for

  • Adobe-style architecture visualization
  • Rustic wedding invitations and decor
  • Natural skincare product branding
  • Artisanal craft market websites
  • Warm interior design inspiration
  • Sustainable living blogs and content

Suggested color roles

primary

Utilize #D77F5B for main calls-to-action, primary headings, or important graphical elements, providing a vibrant yet grounded focal point.

secondary

Employ #BB9B84 for supporting content, subheadings, or background accents, offering a muted, sophisticated warmth.

accent

Apply #F6AA96 for subtle highlights, interactive elements, or decorative details, adding a soft, sun-kissed touch.

background

Use #EBDBC8 as a clean, light background for content areas, ensuring excellent readability for darker text and an airy, sandy feel.

text

A deep, earthy brown like #A26E57 provides optimal contrast for body text and primary content, maintaining the palette's natural integrity.

Accessibility notes

  • Ensure sufficient contrast when using #A26E57 for text on #EBDBC8 backgrounds.
  • Verify that interactive elements colored with #D77F5B or #BB9B84 have adequate contrast against their surrounding elements.
  • Avoid placing light text directly on #F6AA96 or #BB9B84 as contrast may be insufficient.
  • Consider using a slightly darker shade for links or important information to ensure clear differentiation.

Recommended combinations

Adobe Structure

Ideal for structural elements, combining a light background with a muted mid-tone and a deep, grounding color.

#EBDBC8 · #BB9B84 · #A26E57

Terracotta Pop

Excellent for highlighting key information or products, featuring a vibrant terracotta against softer tones.

#D77F5B · #F6AA96 · #EBDBC8

Rustic Harmony

Use for content blocks where a strong, dark text anchors a vibrant accent and a sophisticated secondary color.

#A26E57 · #D77F5B · #BB9B84

CSS variables

:root {
  --sunbaked-clay-1: #D77F5B;
  --sunbaked-clay-2: #F6AA96;
  --sunbaked-clay-3: #EBDBC8;
  --sunbaked-clay-4: #BB9B84;
  --sunbaked-clay-5: #A26E57;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sunbaked-clay": {
        1: "#D77F5B",
        2: "#F6AA96",
        3: "#EBDBC8",
        4: "#BB9B84",
        5: "#A26E57",
      }
    }
  }
}

Related searches

adobe color paletterustic clay toneswarm desert colorssunbaked natural huesterracotta and sand

Palette colors

Hex values

Color 1#D77F5B
·
Color 2#F6AA96
·
Color 3#EBDBC8
·
Color 4#BB9B84
·
Color 5#A26E57
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.2:1Fail
1.1:1Fail
1.4:1Fail
2
1.6:1Fail
1.4:1Fail
1.4:1Fail
2.3:1Fail
3
2.2:1Fail
1.4:1Fail
1.9:1Fail
3.2:1AA18
4
1.1:1Fail
1.4:1Fail
1.9:1Fail
1.7:1Fail
5
1.4:1Fail
2.3:1Fail
3.2:1AA18
1.7:1Fail

Similar palettes

More like Sunbaked Clay

View all earth
Desert Clay Pottery
Sunbaked Adobe Wall
Adobe Sunset Glow
Adobe Sunset Glow
Ancestral Clay Vessel
Ancient Clay Vessel