Palette

Succulent Oasis Glow

Soft greens and creams mimic the serene resilience of desert succulents under a gentle sun.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#6A8E7D#9DC4A6#CCE2CB#F1F8E9#4F6A5B

Palette guide

How to use Succulent Oasis Glow

Overview

The Succulent Oasis Glow palette offers a serene and natural collection of soft greens and creams, mimicking the gentle resilience of desert succulents under a mild sun. With core colors like the muted green #6A8E7D and the soft cream #F1F8E9, alongside the grounding #4F6A5B, this palette is perfect for creating calm and elegant designs. Designers can use this range of tones, including #9DC4A6 and #CCE2CB, to evoke a sense of tranquility and understated beauty. Developers will find it excellent for building minimalist user interfaces or content platforms that require a soothing and sophisticated aesthetic, ideal for wellness, sustainable living, or botanical themes.

Best used for

Spa and wellness branding and websites
Sustainable living and eco-friendly product lines
Minimalist interior design and home decor
Desert-themed photography or travel blogs
Botanical art and illustration with a soft touch
Mindful meditation apps or content

Suggested color roles

primary

#4F6A5B serves as the deepest, most grounding green, excellent for foundational elements, strong headlines, or brand logos.

secondary

#6A8E7D provides a muted mid-green, perfect for secondary headings, content sections, or prominent UI components.

accent

#F1F8E9 offers the softest cream, ideal for subtle highlights, background textures, or a light, airy accent.

background

Use #CCE2CB for a soft, inviting background, or #F1F8E9 for a very light, ethereal canvas that allows darker elements to stand out.

text

#4F6A5B or a dark charcoal provides excellent readability on lighter backgrounds. For secondary text, #6A8E7D works well on #F1F8E9.

Accessibility notes

Ensure sufficient contrast between text and background, especially when using lighter greens like #9DC4A6 for text on #F1F8E9.
Prioritize #4F6A5B for main body text on light backgrounds to meet WCAG contrast requirements.
Avoid pairing #CCE2CB with #F1F8E9 for small text as their contrast may be insufficient.
For interactive elements, use #4F6A5B or #6A8E7D to provide clear visual affordance and feedback.

Recommended combinations

Oasis Depths

Creates a rich, layered green look, suitable for deep backgrounds with subtle, harmonious content.

#4F6A5B · #6A8E7D · #9DC4A6

Desert Glow

Ideal for soft, airy designs, providing a gentle transition for backgrounds or large content blocks, evoking a sunny haze.

#CCE2CB · #F1F8E9 · #9DC4A6

Resilient Beauty

Offers a strong, elegant contrast for headlines and body text against a very light background, with a mid-tone for details.

#4F6A5B · #F1F8E9 · #6A8E7D

CSS variables

:root {
  --succulent-oasis-glow-1: #6A8E7D;
  --succulent-oasis-glow-2: #9DC4A6;
  --succulent-oasis-glow-3: #CCE2CB;
  --succulent-oasis-glow-4: #F1F8E9;
  --succulent-oasis-glow-5: #4F6A5B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "succulent-oasis-glow": {
        1: "#6A8E7D",
        2: "#9DC4A6",
        3: "#CCE2CB",
        4: "#F1F8E9",
        5: "#4F6A5B",
      }
    }
  }
}

Hex values

Color 1#6A8E7D

Color 2#9DC4A6

Color 3#CCE2CB

Color 4#F1F8E9

Color 5#4F6A5B

Accessibility

Contrast checker

1.9:1Fail

2.6:1Fail

3.3:1AA18

1.6:1Fail

1.9:1Fail

1.4:1Fail

1.8:1Fail

3.1:1AA18

2.6:1Fail

1.4:1Fail

1.3:1Fail

4.3:1AA18

3.3:1AA18

1.8:1Fail

1.3:1Fail

5.5:1AA

1.6:1Fail

3.1:1AA18

4.3:1AA18

5.5:1AA

Similar palettes

More like Succulent Oasis Glow

Botanical Sketch Green