Back to palettes

Palette

Sunbaked Adobe Wall

Rich, sun-drenched earth tones bring to mind ancient adobe structures and arid landscapes.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#B3583E#D2691E#E97451#EE815C#F49D78

Palette guide

How to use Sunbaked Adobe Wall

Overview

The "Sunbaked Adobe Wall" palette is a vibrant and cohesive collection of warm, earthy oranges and reds, evoking the intense glow of sun-drenched terracotta. It features a rich, deep orange-red #B3583E and a brighter, inviting #D2691E, leading into softer, more luminous shades like #E97451, #EE815C, and #F49D78. This gradient of warm hues is perfect for designers looking to create energetic, natural, and inviting designs with a strong sense of rustic charm or a vibrant, organic feel. It's particularly effective for projects demanding warmth and visual impact.

Best used for

  • Mediterranean restaurant branding
  • Artisan food market promotions
  • Terracotta pottery e-commerce
  • Summer event marketing
  • Southwest-inspired interior design
  • Outdoor living product catalogs

Suggested color roles

primary

Use #D2691E for prominent headings or key interactive elements to create a strong, warm focal point.

secondary

Apply #B3583E for subheadings, navigation, or significant content blocks, offering a deeper, more grounded warmth.

accent

Reserve #E97451 for highlights, icons, or subtle decorative elements, adding a lively, inviting touch.

background

#F49D78 serves as a soft, luminous background, providing a gentle canvas that maintains the palette's warmth.

text

Dark charcoal or black text works well on #F49D78. For text on darker shades, use #F49D78 or a near-white.

Accessibility notes

  • Ensure sufficient contrast when placing text on #B3583E or #D2691E; light text is often necessary.
  • #F49D78 provides a good light background for dark text, supporting readability.
  • Avoid using #EE815C as text on #F49D78 due to potential low contrast.
  • Always check contrast ratios, especially when using adjacent shades like #E97451 and #EE815C.

Recommended combinations

Terracotta Glow

Excellent for vibrant hero sections or calls-to-action, creating a dynamic and inviting visual flow.

#D2691E · #E97451 · #F49D78

Earthen Depth

Ideal for content blocks or testimonials, offering a strong, grounded base with bright, readable accents.

#B3583E · #F49D78 · #D2691E

Warm Gradient

Effective for subtle background transitions or layered design elements, showcasing the palette's harmonious progression.

#E97451 · #EE815C · #F49D78

CSS variables

:root {
  --sunbaked-adobe-wall-2-1: #B3583E;
  --sunbaked-adobe-wall-2-2: #D2691E;
  --sunbaked-adobe-wall-2-3: #E97451;
  --sunbaked-adobe-wall-2-4: #EE815C;
  --sunbaked-adobe-wall-2-5: #F49D78;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sunbaked-adobe-wall-2": {
        1: "#B3583E",
        2: "#D2691E",
        3: "#E97451",
        4: "#EE815C",
        5: "#F49D78",
      }
    }
  }
}

Related searches

terracotta color palettesunbaked orange tonesrustic warm redsadobe wall colorsvibrant earthy palette

Palette colors

Hex values

Color 1#B3583E
·
Color 2#D2691E
·
Color 3#E97451
·
Color 4#EE815C
·
Color 5#F49D78
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.6:1Fail
1.8:1Fail
2.3:1Fail
2
1.3:1Fail
1.2:1Fail
1.4:1Fail
1.7:1Fail
3
1.6:1Fail
1.2:1Fail
1.1:1Fail
1.4:1Fail
4
1.8:1Fail
1.4:1Fail
1.1:1Fail
1.3:1Fail
5
2.3:1Fail
1.7:1Fail
1.4:1Fail
1.3:1Fail

Similar palettes

More like Sunbaked Adobe Wall

View all earth