Back to palettes

Palette

Sun-Kissed Adobe

Warm, earthy reds and oranges inspired by traditional adobe buildings basking in the desert sun.

EarthNatural5 colors
More Earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sun-Kissed Adobe 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 Sun-Kissed Adobe.

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

Data visualization

#C77B5A#E29577#F5B29B#AA674B#8F523C

Palette guide

How to use Sun-Kissed Adobe

Overview

The Sun-Kissed Adobe palette embodies the rustic charm and warmth of traditional Southwestern architecture, inspired by sun-baked terracotta and natural clay. This earthy collection features inviting hues like the primary `#C77B5A` and the softer `#E29577`, complemented by the delicate `#F5B29B`. Deeper tones, such as the grounding `#AA674B` and the robust `#8F523C`, provide excellent contrast and depth. Ideal for evoking a sense of heritage, comfort, and organic beauty, this palette offers designers and developers a versatile range to create visually appealing and emotionally resonant experiences, particularly in themes of nature and craftsmanship. It brings a grounded, natural feel to any design project.

Best used for

  • Rustic brand identity and logos
  • Southwestern home decor and interior design concepts
  • E-commerce sites for artisan crafts or natural products
  • Website backgrounds and UI elements with an organic feel
  • Editorial design for travel or cultural magazines
  • Packaging for natural or handmade goods

Suggested color roles

primary

Use `#C77B5A` as a dominant brand color for headers, main buttons, and key visual elements to convey warmth and authenticity.

secondary

Apply `#AA674B` for subheadings, secondary calls-to-action, or important informational blocks, offering a richer, grounding presence.

accent

Ideal for subtle highlights, interactive states, or decorative elements where a light, airy touch is desired, use `#F5B29B`.

background

A light, warm base perfect for content areas, cards, or page backgrounds, `#F5B29B` ensures readability and a welcoming feel.

text

Utilize `#8F523C` for body text and important labels to ensure excellent readability against lighter backgrounds like `#F5B29B`.

Accessibility notes

  • Ensure sufficient contrast when using `#AA674B` or `#8F523C` for text on lighter backgrounds like `#F5B29B` or `#E29577`.
  • Avoid placing `#F5B29B` text directly on `#E29577` as contrast may be insufficient for WCAG AA standards.
  • Interactive elements like buttons using `#C77B5A` should have a clear focus state and visible text in a contrasting color, such as white or `#8F523C`.
  • Consider using `#8F523C` for all primary body text to maximize readability across various screen types and lighting conditions.

Recommended combinations

Warm Base

A soft background with a strong primary action color and highly readable dark text.

#F5B29B · #C77B5A · #8F523C

Earthy Contrast

Rich heading background with a supportive secondary and a light accent for details or highlights.

#AA674B · #E29577 · #F5B29B

Desert Sunset

Primary brand color, darkest tone for strong visual impact, and a mid-tone for balanced sections.

#C77B5A · #8F523C · #E29577

CSS variables

:root {
  --sun-kissed-adobe-1: #C77B5A;
  --sun-kissed-adobe-2: #E29577;
  --sun-kissed-adobe-3: #F5B29B;
  --sun-kissed-adobe-4: #AA674B;
  --sun-kissed-adobe-5: #8F523C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sun-kissed-adobe": {
        1: "#C77B5A",
        2: "#E29577",
        3: "#F5B29B",
        4: "#AA674B",
        5: "#8F523C",
      }
    }
  }
}

Related searches

terracotta color schemesouthwest design paletteadobe house colorswarm earthy tonesnatural desert palette

Palette colors

Hex values

Color 1#C77B5A
·
Color 2#E29577
·
Color 3#F5B29B
·
Color 4#AA674B
·
Color 5#8F523C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.8:1Fail
1.3:1Fail
1.9:1Fail
2
1.4:1Fail
1.3:1Fail
1.9:1Fail
2.6:1Fail
3
1.8:1Fail
1.3:1Fail
2.5:1Fail
3.4:1AA18
4
1.3:1Fail
1.9:1Fail
2.5:1Fail
1.4:1Fail
5
1.9:1Fail
2.6:1Fail
3.4:1AA18
1.4:1Fail

Similar palettes

More like Sun-Kissed Adobe

View all Earth