Back to palettes

Palette

Succulent Garden Hues

A calming blend of muted greens and soft purples, capturing the subtle beauty of a succulent plant garden.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Succulent Garden Hues 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 Garden Hues.

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

Data visualization

#6B8E23#8FBC8F#ADD8E6#DDA0DD#B0C4DE

Palette guide

How to use Succulent Garden Hues

Overview

The Succulent Garden Hues palette offers a calming and sophisticated blend of muted greens, soft blues, and delicate purples, echoing the serene beauty of a succulent plant garden. With key colors like the natural green #6B8E23, the soft blue #ADD8E6, and the gentle purple #DDA0DD, this palette is ideal for creating designs that feel peaceful and harmonious. Designers will appreciate its pastel qualities for subtle and inviting aesthetics, while developers can use it to build user interfaces that promote relaxation and clarity. The inclusion of #8FBC8F and #B0C4DE ensures a gentle transition between shades, making it perfect for mindful branding or comforting digital experiences.

Best used for

  • Spa and wellness brand identity and websites
  • Nursery and children's product design
  • Mindful living blogs and meditation apps
  • Craft and handmade goods packaging
  • Soft, inviting web design for personal portfolios
  • Spring or pastel-themed event invitations

Suggested color roles

primary

#6B8E23 provides a grounding, natural green, excellent for primary headings, logos, or key visual elements.

secondary

#B0C4DE serves as a soft, cool blue, perfect for secondary backgrounds, subtle dividers, or supporting content areas.

accent

#DDA0DD offers a delicate pastel purple, ideal for small accents, hover states, or to add a touch of whimsy and warmth.

background

Use #ADD8E6 for a light, airy background, or #B0C4DE for a slightly deeper, calming base that pairs well with lighter text.

text

A dark charcoal or muted plum on lighter backgrounds provides good readability. #6B8E23 can be used for headings on very light backgrounds.

Accessibility notes

  • Pastel colors can have low contrast; ensure text using #DDA0DD or #ADD8E6 on similar backgrounds meets WCAG standards.
  • Pair darker text (e.g., a charcoal or deep muted purple) with the lightest backgrounds (#ADD8E6, #B0C4DE) for optimal readability.
  • Use #6B8E23 for important interactive elements to ensure they stand out against the softer palette.
  • Provide clear focus states for interactive elements, as the subtle color variations might be hard to distinguish for some users.

Recommended combinations

Calm Garden

Creates a serene, natural environment, suitable for content sections or pleasant visual accents.

#6B8E23 · #8FBC8F · #ADD8E6

Pastel Bloom

A gentle and inviting mix, perfect for decorative elements, soft illustrations, or subtle UI components.

#DDA0DD · #B0C4DE · #8FBC8F

Fresh Harmony

Offers a delightful contrast between natural green, cool blue, and soft purple, ideal for playful yet calm designs.

#6B8E23 · #ADD8E6 · #DDA0DD

CSS variables

:root {
  --succulent-garden-hues-2-1: #6B8E23;
  --succulent-garden-hues-2-2: #8FBC8F;
  --succulent-garden-hues-2-3: #ADD8E6;
  --succulent-garden-hues-2-4: #DDA0DD;
  --succulent-garden-hues-2-5: #B0C4DE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "succulent-garden-hues-2": {
        1: "#6B8E23",
        2: "#8FBC8F",
        3: "#ADD8E6",
        4: "#DDA0DD",
        5: "#B0C4DE",
      }
    }
  }
}

Related searches

pastel succulent color palettecalm garden huesgreen and purple aestheticsoft botanical designnatural serene color scheme

Palette colors

Hex values

Color 1#6B8E23
·
Color 2#8FBC8F
·
Color 3#ADD8E6
·
Color 4#DDA0DD
·
Color 5#B0C4DE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
2.5:1Fail
1.8:1Fail
2.1:1Fail
2
1.8:1Fail
1.4:1Fail
1:1Fail
1.2:1Fail
3
2.5:1Fail
1.4:1Fail
1.4:1Fail
1.2:1Fail
4
1.8:1Fail
1:1Fail
1.4:1Fail
1.2:1Fail
5
2.1:1Fail
1.2:1Fail
1.2:1Fail
1.2:1Fail

Similar palettes

More like Succulent Garden Hues

View all earth
Succulent Garden Hues
Bamboo Serene Path
Coastal Dune Breeze
Coastal Dune Grass
Deep Forest Emerald
Desert Sage Bloom