Back to palettes

Palette

Desert Succulent Path

Muted greens and dusty tones, reminiscent of resilient succulent plants thriving in the desert.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Desert Succulent Path 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 Succulent Path.

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

Data visualization

#A3B090#7B8C7C#C5D0BA#5E6A5E#B1C0A0

Palette guide

How to use Desert Succulent Path

Overview

The Desert Succulent Path palette offers a collection of muted greens and dusty earth tones, perfectly capturing the serene essence of resilient desert botanicals. Featuring the deep, anchoring #5E6A5E, it gently transitions through supportive greens like #7B8C7C and #A3B090, culminating in the light, airy #C5D0BA and #B1C0A0. This palette is an excellent choice for designers and developers seeking to convey a sense of natural tranquility, organic authenticity, or a strong connection to nature. Its subtle variations provide depth without being overwhelming, making it highly adaptable for creating sophisticated, calm, and inviting digital or print environments.

Best used for

  • Botanical garden branding
  • Eco-tourism marketing materials
  • Organic food packaging design
  • Wellness and meditation app interfaces
  • Landscape architecture presentations
  • Understated, natural corporate branding

Suggested color roles

primary

Utilize #5E6A5E for dominant elements such as main headings, hero sections, or primary buttons, providing depth and stability.

secondary

Employ #7B8C7C for supporting roles like subheadings, secondary navigation, or informational panels, maintaining a cohesive green theme.

accent

Introduce #A3B090 as a subtle accent for highlights, small icons, or decorative lines, adding a touch of warm green.

background

Designate #C5D0BA for large background areas or main content sections, offering a clean, expansive, and natural canvas.

text

For optimal readability, use #5E6A5E or a deep charcoal for body text against lighter backgrounds such as #C5D0BA or #B1C0A0.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using lighter greens like #B1C0A0 or #C5D0BA.
  • Verify that #A3B090 provides enough contrast if used for critical UI elements against adjacent lighter colors.
  • Avoid placing light-colored text on mid-tone greens like #7B8C7C to prevent readability issues.
  • Use a contrast checker to confirm WCAG AA compliance for all text and interactive elements, particularly with #5E6A5E on light backgrounds.

Recommended combinations

Deep & Dusty

Ideal for a strong primary color with a light background and a subtle, warm accent, perfect for clean layouts.

#5E6A5E · #C5D0BA · #A3B090

Muted Layers

Excellent for creating layered graphics or subtle depth in UI elements, maintaining a soft, natural flow.

#7B8C7C · #B1C0A0 · #C5D0BA

Arid Highlight

Use a light base with a warm green highlight and a deep green for text or prominent features, ensuring clarity.

#C5D0BA · #A3B090 · #5E6A5E

CSS variables

:root {
  --desert-succulent-path-1: #A3B090;
  --desert-succulent-path-2: #7B8C7C;
  --desert-succulent-path-3: #C5D0BA;
  --desert-succulent-path-4: #5E6A5E;
  --desert-succulent-path-5: #B1C0A0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "desert-succulent-path": {
        1: "#A3B090",
        2: "#7B8C7C",
        3: "#C5D0BA",
        4: "#5E6A5E",
        5: "#B1C0A0",
      }
    }
  }
}

Related searches

arid green color palettebotanical natural huessage desert color schememuted earth tone brandingcalm green web design

Palette colors

Hex values

Color 1#A3B090
·
Color 2#7B8C7C
·
Color 3#C5D0BA
·
Color 4#5E6A5E
·
Color 5#B1C0A0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
1.4:1Fail
2.5:1Fail
1.2:1Fail
2
1.6:1Fail
2.2:1Fail
1.6:1Fail
1.9:1Fail
3
1.4:1Fail
2.2:1Fail
3.5:1AA18
1.2:1Fail
4
2.5:1Fail
1.6:1Fail
3.5:1AA18
3:1Fail
5
1.2:1Fail
1.9:1Fail
1.2:1Fail
3:1Fail

Similar palettes

More like Desert Succulent Path

View all earth