Palette

Agave Spire Dawn

Captures the muted, dry beauty of desert succulents blooming under the soft morning light.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Agave Spire Dawn 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 Agave Spire Dawn.

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

Data visualization

#DDC8AE#AEBAA9#6B807B#B87C5C#E6DDD0

Palette guide

How to use Agave Spire Dawn

Overview

The Agave Spire Dawn palette captures the muted, dry beauty of desert succulents blooming under the soft morning light. This natural and subtle collection includes a warm beige #E6DDD0, a light sandy brown #DDC8AE, a soft sage green #AEBAA9, a deep olive-grey #6B807B, and a rich terracotta brown #B87C5C. It's perfect for designers aiming to convey organic elegance, dryness, and a serene, understated aesthetic. Developers will find these harmonious hex codes excellent for creating naturalistic interfaces, artisanal branding, and content that evokes the quiet strength of desert flora.

Best used for

Desert landscape photography
Sustainable fashion brands
Earthy product packaging
Minimalist home decor
Yoga and wellness retreats
Artisanal craft websites

Suggested color roles

primary

Use #AEBAA9 as a calming primary for main headings or large sections, representing succulent foliage.

secondary

Employ #DDC8AE for clean, airy backgrounds or secondary elements, mimicking morning light.

accent

Apply #B87C5C sparingly for impactful calls to action or key highlights, adding a warm, earthy pop.

background

Utilize #E6DDD0 for crisp, expansive backgrounds, providing a fresh, neutral canvas.

text

A deep brown or black works perfectly on #E6DDD0, while white text is ideal on #6B807B for strong readability.

Accessibility notes

Ensure sufficient contrast for text on #E6DDD0; a dark text color like #6B807B is essential.
Avoid using #DDC8AE for text against #E6DDD0 as contrast will be too low for readability.
White text on #6B807B and #B87C5C should meet WCAG AA contrast standards.
For interactive elements, ensure distinct visual cues beyond color, especially with subtle greens and browns.

Recommended combinations

Desert Bloom

For headers or hero sections, blending light with warm, earthy accents.

#E6DDD0 · #DDC8AE · #B87C5C

Succulent Greens

Ideal for layered UI elements or textural backgrounds, showcasing natural foliage.

#AEBAA9 · #6B807B · #DDC8AE

Spire Shadows

Effective for footers or distinct content blocks, offering grounded warmth and contrast.

#6B807B · #B87C5C · #E6DDD0

CSS variables

:root {
  --agave-spire-dawn-1: #DDC8AE;
  --agave-spire-dawn-2: #AEBAA9;
  --agave-spire-dawn-3: #6B807B;
  --agave-spire-dawn-4: #B87C5C;
  --agave-spire-dawn-5: #E6DDD0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "agave-spire-dawn": {
        1: "#DDC8AE",
        2: "#AEBAA9",
        3: "#6B807B",
        4: "#B87C5C",
        5: "#E6DDD0",
      }
    }
  }
}

Hex values

Color 1#DDC8AE

Color 2#AEBAA9

Color 3#6B807B

Color 4#B87C5C

Color 5#E6DDD0

Accessibility

Contrast checker

1.2:1Fail

2.6:1Fail

2.1:1Fail

1.2:1Fail

2.1:1Fail

1.7:1Fail

1.5:1Fail

2.6:1Fail

2.1:1Fail

1.2:1Fail

3.1:1AA18

2.1:1Fail

1.7:1Fail

1.2:1Fail

2.6:1Fail

1.2:1Fail

1.5:1Fail

3.1:1AA18

2.6:1Fail

Similar palettes

More like Agave Spire Dawn

Agave Spire Dawn

See it in context.

Ready when you are.

Built with Agave Spire Dawn.

How to use Agave Spire Dawn

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Desert Bloom

Succulent Greens

Spire Shadows

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Agave Spire Dawn