Back to palettes

Palette

Arid Sands Mirage

Evokes the quiet beauty of a vast desert landscape, with a hidden, refreshing spring.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Arid Sands Mirage 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 Arid Sands Mirage.

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

Data visualization

#C4A484#D6BBA4#A67B5B#8C6A4F#E0CCA6

Palette guide

How to use Arid Sands Mirage

Overview

The Arid Sands Mirage palette offers a rich collection of warm, earthy tones, perfect for evoking the quiet beauty of a vast desert with a hint of hidden refreshment. Featuring shades like the inviting `#C4A484`, lighter `#D6BBA4`, and grounding `#A67B5B`, this palette provides a sophisticated foundation for designers and developers. The deeper `#8C6A4F` adds crucial depth and elegance, while `#E0CCA6` offers a gentle, almost shimmering highlight. This palette is exceptionally versatile for projects requiring natural warmth, rustic charm, or a timeless, understated elegance that feels both grounded and expansive.

Best used for

  • Luxury travel and resort branding
  • Artisan craft and handmade product showcases
  • Warm, inviting e-commerce websites
  • Interior design concepts for cozy, natural spaces
  • Editorial design with a classic, earthy aesthetic
  • Photography portfolios of landscapes or portraits

Suggested color roles

primary

Use `#C4A484` as a primary color for large sections or main elements, offering a warm and approachable base.

secondary

Employ `#D6BBA4` for supporting content areas or lighter UI elements, providing subtle variation and softness.

accent

Apply `#8C6A4F` sparingly for strong calls-to-action, important links, or to add visual weight and sophistication.

background

Utilize `#E0CCA6` as a soft, luminous background color, creating an expansive feel that highlights other elements.

text

For optimal readability, use `#8C6A4F` for body text and headings against lighter backgrounds. A deep charcoal can also work well.

Accessibility notes

  • Ensure sufficient contrast between text in `#8C6A4F` and lighter backgrounds like `#E0CCA6` or `#D6BBA4`.
  • Avoid placing very light text (e.g., in `#E0CCA6`) on similarly light backgrounds to prevent readability issues.
  • Use a contrast checker for all text and interactive elements to ensure compliance with WCAG guidelines.
  • For small text or critical information, consider using the darkest color, `#8C6A4F`, to maximize legibility.

Recommended combinations

Mirage Light

Ideal for creating soft, layered backgrounds or elegant transitions in hero sections.

#E0CCA6 · #D6BBA4 · #C4A484

Desert Depth

Excellent for defining content blocks, navigation, or strong visual anchors within a design.

#C4A484 · #A67B5B · #8C6A4F

Warm Earth

Effective for a brand identity that needs to convey natural warmth, sophistication, and reliability.

#D6BBA4 · #A67B5B · #8C6A4F

CSS variables

:root {
  --arid-sands-mirage-1: #C4A484;
  --arid-sands-mirage-2: #D6BBA4;
  --arid-sands-mirage-3: #A67B5B;
  --arid-sands-mirage-4: #8C6A4F;
  --arid-sands-mirage-5: #E0CCA6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "arid-sands-mirage": {
        1: "#C4A484",
        2: "#D6BBA4",
        3: "#A67B5B",
        4: "#8C6A4F",
        5: "#E0CCA6",
      }
    }
  }
}

Related searches

warm desert paletteearthy sand tonesrustic natural colorsmirage inspired aestheticelegant brown beige scheme

Palette colors

Hex values

Color 1#C4A484
·
Color 2#D6BBA4
·
Color 3#A67B5B
·
Color 4#8C6A4F
·
Color 5#E0CCA6
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.6:1Fail
2.1:1Fail
1.5:1Fail
2
1.3:1Fail
2.1:1Fail
2.7:1Fail
1.2:1Fail
3
1.6:1Fail
2.1:1Fail
1.3:1Fail
2.4:1Fail
4
2.1:1Fail
2.7:1Fail
1.3:1Fail
3.1:1AA18
5
1.5:1Fail
1.2:1Fail
2.4:1Fail
3.1:1AA18

Similar palettes

More like Arid Sands Mirage

View all earth
Desert Bloom Whisper
Desert Mirage Bloom
Golden Sands Retreat
Sahara Sandstone Sun
Sedona Stone Glow
Whispering Desert Sands