Palette

Arid Succulent Blush

A subtle, almost desaturated palette mirroring the resilient beauty of desert succulents under a gentle sun.

neutralminimal5 colors

More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Arid Succulent Blush 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 Arid Succulent Blush.

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

Data visualization

#A2B29A#C2D0B9#E0EADD#7A8D74#A68F8E

Palette guide

How to use Arid Succulent Blush

Overview

The Arid Succulent Blush palette offers a serene and minimalist aesthetic, drawing inspiration from the muted greens of desert flora and soft, sun-kissed earth tones. This tranquil collection, featuring key shades like the calming sage green #A2B29A, the delicate off-white #E0EADD, and a subtle blush of #A68F8E, is perfect for designs seeking a natural, understated elegance. Developers will appreciate its cohesive, low-contrast harmony for creating soothing digital interfaces or subtle branding. Designers can leverage these desaturated hues to evoke a sense of calm, resilience, and organic beauty in their projects, ensuring a sophisticated and timeless appeal.

Best used for

Wellness and spa branding
Eco-friendly product packaging
Minimalist website design
Nature-inspired interior decor
Sustainable fashion lines
Yoga studio marketing materials

Suggested color roles

primary

Use #A2B29A as a foundational brand color for large sections, headers, or key graphical elements, providing a calming and natural presence.

secondary

Employ #C2D0B9 for supporting content areas, sub-headings, or subtle backgrounds, offering a slightly lighter, harmonious extension of the primary green.

accent

Apply #A68F8E sparingly for calls-to-action, highlights, or decorative details to introduce a soft, warm contrast without overwhelming the palette's tranquility.

background

Utilize #E0EADD as a clean, airy background canvas for most content, ensuring excellent readability and a fresh, expansive feel.

text

For body text and primary content, use #7A8D74. Its darker green provides good contrast against lighter backgrounds like #E0EADD, maintaining the palette's organic feel.

Accessibility notes

Ensure sufficient contrast when pairing lighter shades like #C2D0B9 and #E0EADD, especially for smaller text or interactive elements.
Use #7A8D74 or a dark charcoal for body text on #E0EADD to meet WCAG AA readability standards.
The accent #A68F8E should be reserved for decorative elements or larger text to avoid low contrast issues on mid-tone backgrounds.
When using #A2B29A or #C2D0B9 for text, check contrast against light backgrounds like #E0EADD; white text is suitable for dark backgrounds.

Recommended combinations

Desert Calm

Ideal for clean content layouts with a light background, dark readable text, and a serene primary color for headings or blocks.

#E0EADD · #7A8D74 · #A2B29A

Blush Accent

Combine the main green with its lighter variant and the blush accent for a gentle, layered design with subtle warmth and depth.

#A2B29A · #C2D0B9 · #A68F8E

Deep Root

Use the darkest green as a bold element, paired with the lightest background and the blush for a sophisticated, grounded aesthetic.

#7A8D74 · #E0EADD · #A68F8E

CSS variables

:root {
  --arid-succulent-blush-1: #A2B29A;
  --arid-succulent-blush-2: #C2D0B9;
  --arid-succulent-blush-3: #E0EADD;
  --arid-succulent-blush-4: #7A8D74;
  --arid-succulent-blush-5: #A68F8E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "arid-succulent-blush": {
        1: "#A2B29A",
        2: "#C2D0B9",
        3: "#E0EADD",
        4: "#7A8D74",
        5: "#A68F8E",
      }
    }
  }
}

Hex values

Color 1#A2B29A

Color 2#C2D0B9

Color 3#E0EADD

Color 4#7A8D74

Color 5#A68F8E

Accessibility

Contrast checker

1.4:1Fail

1.8:1Fail

1.6:1Fail

1.4:1Fail

1.3:1Fail

2.2:1Fail

1.9:1Fail

1.8:1Fail

1.3:1Fail

2.9:1Fail

2.4:1Fail

1.6:1Fail

2.2:1Fail

2.9:1Fail

1.2:1Fail

1.4:1Fail

1.9:1Fail

2.4:1Fail

1.2:1Fail

Similar palettes

More like Arid Succulent Blush

Arid Succulent Blush

See it in context.

Ready when you are.

Built with Arid Succulent Blush.

How to use Arid Succulent Blush

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Desert Calm

Blush Accent

Deep Root

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Arid Succulent Blush