Palette

Desert Succulent Glow

A resilient blend of greens and yellows, mirroring the vibrant life of succulents under the desert sun.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#3F5F4F#6B8E23#A9A45B#D4AF37#EBC870

Palette guide

How to use Desert Succulent Glow

Overview

The Desert Succulent Glow palette embodies the vibrant life of succulents under the desert sun, featuring a resilient blend of greens and illuminating yellows. Key colors include the deep #3F5F4F, a lively #6B8E23, and the warm #A9A45B, culminating in the bright #D4AF37 and #EBC870. This palette is exceptionally useful for designers and developers aiming to create energetic, natural, and inviting digital experiences. It evokes warmth, vitality, and an adventurous spirit, making it ideal for brands focused on outdoor activities, natural products, or those wanting to infuse a sense of sunny optimism into their designs.

Best used for

Outdoor adventure branding
Eco-tourism websites
Natural food and beverage packaging
Educational content about nature
Summer campaign designs
Vibrant web and app interfaces

Suggested color roles

primary

Utilize #6B8E23 as a lively primary color for headers, call-to-actions, or prominent illustrations.

secondary

Employ #A9A45B for secondary content blocks, backgrounds, or to add a warm, earthy tone.

accent

Apply #D4AF37 for high-impact accents, interactive elements, or to draw attention to key information.

background

Use #EBC870 as a warm, inviting background color, providing a sunny canvas for darker text.

text

Choose #3F5F4F for body text and headings on lighter backgrounds like #EBC870 to ensure optimal readability.

Accessibility notes

Ensure sufficient contrast between #EBC870 and dark text colors like #3F5F4F for all content.
Be cautious when using #A9A45B for small text, as its mid-tone value may not meet WCAG AA contrast standards.
Test interactive elements in #D4AF37 to confirm clear visual feedback against other palette colors.
Always verify WCAG AA contrast standards, especially for critical information against lighter shades.

Recommended combinations

Sunny Desert

Create a bright, energetic feel for hero sections or featured content, combining sunny yellows with a vibrant green.

#EBC870 · #D4AF37 · #6B8E23

Grounded Glow

Ideal for strong branding or prominent elements, blending deep green with warm, earthy gold accents.

#3F5F4F · #A9A45B · #D4AF37

Vibrant Foliage

Use for natural-themed designs, combining a lively green with a muted gold and a deep, grounding green.

#6B8E23 · #A9A45B · #3F5F4F

CSS variables

:root {
  --desert-succulent-glow-1: #3F5F4F;
  --desert-succulent-glow-2: #6B8E23;
  --desert-succulent-glow-3: #A9A45B;
  --desert-succulent-glow-4: #D4AF37;
  --desert-succulent-glow-5: #EBC870;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "desert-succulent-glow": {
        1: "#3F5F4F",
        2: "#6B8E23",
        3: "#A9A45B",
        4: "#D4AF37",
        5: "#EBC870",
      }
    }
  }
}

Hex values

Color 1#3F5F4F

Color 2#6B8E23

Color 3#A9A45B

Color 4#D4AF37

Color 5#EBC870

Accessibility

Contrast checker

1.9:1Fail

2.8:1Fail

3.4:1AA18

4.4:1AA18

1.9:1Fail

1.5:1Fail

1.8:1Fail

2.4:1Fail

2.8:1Fail

1.5:1Fail

1.2:1Fail

1.6:1Fail

3.4:1AA18

1.8:1Fail

1.2:1Fail

1.3:1Fail

4.4:1AA18

2.4:1Fail

1.6:1Fail

1.3:1Fail

Similar palettes

More like Desert Succulent Glow

View all earth

Desert Succulent

Desert Succulent Array

Desert Succulent Hues

Oasis Garden Oasis

Sun-Kissed Desert Sage

Adobe Sunset