Palette

Desert Sunbaked Earth

Sun-drenched hues of desert sand, succulent blooms, and rustic adobe homes.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#A65D3D#C87C53#E3A37C#F0C8B0#FAEEDD

Palette guide

How to use Desert Sunbaked Earth

Overview

The Desert Sunbaked Earth palette captures the warm, sun-drenched hues of desert sand, succulent blooms, and rustic adobe homes. Featuring the deep terracotta of #A65D3D, it transitions through inviting oranges like #C87C53 and soft peaches such as #E3A37C and #F0C8B0, culminating in the airy #FAEEDD. This palette is an excellent choice for designers and developers aiming to evoke a sense of natural warmth, traditional craftsmanship, or a welcoming, cozy atmosphere. Its harmonious blend of earthy oranges and creams creates a sophisticated yet grounded aesthetic, perfect for designs that require both vibrancy and a connection to nature.

Best used for

Southwestern decor and architecture
Natural beauty and skincare brands
Artisanal crafts and handmade goods
Travel blogs focusing on arid regions
Warm and inviting digital interfaces
Traditional or heritage branding

Suggested color roles

primary

Designate #A65D3D for foundational elements like main navigation, footers, or bold headlines, establishing a rich, earthy anchor.

secondary

Utilize #C87C53 for supporting roles such as subheadings, secondary buttons, or background sections, offering a warm, inviting orange.

accent

Introduce #E3A37C as a soft peach accent for highlights, small icons, or decorative details, providing a gentle pop of color.

background

Apply #FAEEDD to main content areas or large backgrounds, creating a light, warm, and highly readable canvas.

text

For optimal readability, use #A65D3D or a rich charcoal against lighter backgrounds such as #FAEEDD or #F0C8B0.

Accessibility notes

Ensure sufficient contrast for text on #F0C8B0 and #FAEEDD; dark text is always recommended.
Verify that #E3A37C provides enough contrast if used for critical UI elements against adjacent lighter colors.
Avoid placing light-colored text on mid-tone oranges like #C87C53 to prevent readability issues.
Use a contrast checker to confirm WCAG AA compliance for all text and interactive elements within this warm palette.

Recommended combinations

Adobe Foundation

Perfect for a strong primary color on a very light background with a warm secondary, great for branding and web layouts.

#A65D3D · #FAEEDD · #C87C53

Soft Desert Bloom

Ideal for creating delicate layered backgrounds or subtle graphic elements, evoking a gentle, natural feel.

#E3A37C · #F0C8B0 · #A65D3D

Sunbaked Contrast

Use the lightest color as a background with the darkest as text, and a mid-tone for accents, ensuring clarity and warmth.

#FAEEDD · #A65D3D · #C87C53

CSS variables

:root {
  --desert-sunbaked-earth-1: #A65D3D;
  --desert-sunbaked-earth-2: #C87C53;
  --desert-sunbaked-earth-3: #E3A37C;
  --desert-sunbaked-earth-4: #F0C8B0;
  --desert-sunbaked-earth-5: #FAEEDD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "desert-sunbaked-earth": {
        1: "#A65D3D",
        2: "#C87C53",
        3: "#E3A37C",
        4: "#F0C8B0",
        5: "#FAEEDD",
      }
    }
  }
}

Hex values

Color 1#A65D3D

Color 2#C87C53

Color 3#E3A37C

Color 4#F0C8B0

Color 5#FAEEDD

Accessibility

Contrast checker

1.5:1Fail

2.3:1Fail

3.2:1AA18

4.3:1AA18

1.5:1Fail

2.1:1Fail

2.8:1Fail

2.3:1Fail

1.5:1Fail

1.4:1Fail

1.9:1Fail

3.2:1AA18

2.1:1Fail

1.4:1Fail

1.3:1Fail

4.3:1AA18

2.8:1Fail

1.9:1Fail

1.3:1Fail

Similar palettes

More like Desert Sunbaked Earth

Desert Sunbaked Earth

See it in context.

Ready when you are.

Built with Desert Sunbaked Earth.

How to use Desert Sunbaked Earth

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Adobe Foundation

Soft Desert Bloom

Sunbaked Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Desert Sunbaked Earth