Palette

Desert Mirage Bloom

Captures the subtle beauty of a desert landscape when rare flowers emerge, hinting at hidden life.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Desert Mirage Bloom 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 Mirage Bloom.

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

Data visualization

#D4AF37#E0B678#9E6F3C#5C4B3E#E6E0D2

Palette guide

How to use Desert Mirage Bloom

Overview

The Desert Mirage Bloom palette captures the subtle beauty of a desert landscape when rare flowers emerge, hinting at hidden life. This sophisticated collection features a vibrant golden ochre #D4AF37, a warm sandy beige #E0B678, and a rich, grounding brown #9E6F3C. The deep, dark #5C4B3E provides strong contrast, while the soft off-white #E6E0D2 offers a clean, expansive backdrop. It's an excellent choice for designers and developers aiming for a natural, elegant, and subtly vibrant aesthetic in branding, web design, or artisanal product lines.

Best used for

Artisan food and beverage branding
High-end natural skincare or cosmetic packaging
Websites for luxury travel or unique experiences
Interior design for sophisticated, earthy spaces
Editorial design for art or lifestyle magazines
Digital interfaces with a warm, inviting, and premium feel

Suggested color roles

primary

Use #D4AF37 for main brand elements, headers, or calls-to-action to convey warmth and value.

secondary

Apply #E0B678 for supporting content, subheadings, or as a gentle background for sections.

accent

Highlight key information or interactive elements with #9E6F3C, providing depth and richness.

background

Employ #E6E0D2 as a clean, expansive background, allowing other colors to truly bloom.

text

Utilize #5C4B3E for body text and important labels, ensuring excellent readability and a sophisticated presence.

Accessibility notes

Ensure #5C4B3E text has sufficient contrast on #E6E0D2 or #E0B678 backgrounds.
Avoid using #E0B678 text on #E6E0D2 directly, as contrast will be too low.
When using #D4AF37 or #9E6F3C as a background, ensure text is white or very light for readability.
Check button states and hover effects to maintain WCAG contrast guidelines across the palette.

Recommended combinations

Golden Bloom

Ideal for creating a soft, radiant glow in headers or introductory sections.

#D4AF37 · #E0B678 · #E6E0D2

Hidden Life

Perfect for grounding elements and providing strong, readable contrast.

#9E6F3C · #5C4B3E · #E6E0D2

Mirage Depth

Excellent for dramatic visual sections or high-impact branding elements.

#D4AF37 · #9E6F3C · #5C4B3E

CSS variables

:root {
  --desert-mirage-bloom-1: #D4AF37;
  --desert-mirage-bloom-2: #E0B678;
  --desert-mirage-bloom-3: #9E6F3C;
  --desert-mirage-bloom-4: #5C4B3E;
  --desert-mirage-bloom-5: #E6E0D2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "desert-mirage-bloom": {
        1: "#D4AF37",
        2: "#E0B678",
        3: "#9E6F3C",
        4: "#5C4B3E",
        5: "#E6E0D2",
      }
    }
  }
}

Hex values

Color 1#D4AF37

Color 2#E0B678

Color 3#9E6F3C

Color 4#5C4B3E

Color 5#E6E0D2

Accessibility

Contrast checker

1.1:1Fail

2.1:1Fail

3.9:1AA18

1.6:1Fail

1.1:1Fail

2.3:1Fail

4.4:1AA18

1.4:1Fail

2.1:1Fail

2.3:1Fail

1.9:1Fail

3.3:1AA18

3.9:1AA18

4.4:1AA18

1.9:1Fail

6.3:1AA

1.6:1Fail

1.4:1Fail

3.3:1AA18

6.3:1AA

Similar palettes

More like Desert Mirage Bloom

View all earth

Canyon Earth Clay

Ochre Dune Wildflower