Palette

Desert Oasis Bloom

A soothing blend inspired by water and life flourishing in arid landscapes.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Desert Oasis Bloom 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 Oasis Bloom.

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

Data visualization

#E0C2A0#F7DFB1#A5CDA6#639E92#3A666D

Palette guide

How to use Desert Oasis Bloom

Overview

The Desert Oasis Bloom palette captures the serene beauty of life thriving in arid landscapes, blending cool water tones with warm sandy hues. It features a soft, inviting beige, #E0C2A0, alongside a lighter, creamy sand shade, #F7DFB1, perfect for foundational elements. The palette introduces refreshing greens with #A5CDA6 and a deeper, tranquil #639E92, reminiscent of hidden springs and lush vegetation. A grounding, deep teal, #3A666D, completes the set, providing a strong anchor. This collection is ideal for designs aiming to evoke calm, natural balance, and subtle vibrancy, suitable for wellness brands or eco-conscious projects.

Best used for

Wellness and spa branding
Eco-friendly product design and packaging
Nature-inspired web and app interfaces
Tranquil interior design concepts
Relaxation and mindfulness applications
Botanical art and illustration

Suggested color roles

primary

#A5CDA6 - Use this soft, refreshing green for primary calls-to-action or key brand elements to convey growth and tranquility.

secondary

#639E92 - A deeper, calming teal-green, excellent for supporting headings, navigational elements, or subtle background accents.

accent

#3A666D - This deep, grounding teal works well for strong accents, important icons, or interactive states, adding depth and sophistication.

background

#F7DFB1 - A light, creamy sand tone, perfect for clean, expansive backgrounds that offer warmth without visual clutter.

text

#3A666D - Recommended for body text and essential information, providing optimal readability against #F7DFB1 and other lighter palette colors.

Accessibility notes

Ensure sufficient contrast between #A5CDA6 (light green) and #3A666D (deep teal) when used for text.
The light background #F7DFB1 pairs well with darker text colors like #3A666D for readability.
Avoid placing light greens like #A5CDA6 or #639E92 on #E0C2A0 or #F7DFB1 if used as text, due to insufficient contrast.
For accessible text, always use #3A666D or a dark charcoal against #E0C2A0, #F7DFB1, and #A5CDA6.

Recommended combinations

Desert Bloom

Creating a balanced, fresh layout with a light background, a calming primary, and a strong accent.

#F7DFB1 · #A5CDA6 · #3A666D

Oasis Depths

Ideal for sophisticated designs, evoking natural depth with warm sand and cool, deep water tones.

#E0C2A0 · #639E92 · #3A666D

Calm Sands

Soft, harmonious designs for gentle branding, serene web pages, or understated natural aesthetics.

#E0C2A0 · #F7DFB1 · #A5CDA6

CSS variables

:root {
  --desert-oasis-bloom-2-1: #E0C2A0;
  --desert-oasis-bloom-2-2: #F7DFB1;
  --desert-oasis-bloom-2-3: #A5CDA6;
  --desert-oasis-bloom-2-4: #639E92;
  --desert-oasis-bloom-2-5: #3A666D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "desert-oasis-bloom-2": {
        1: "#E0C2A0",
        2: "#F7DFB1",
        3: "#A5CDA6",
        4: "#639E92",
        5: "#3A666D",
      }
    }
  }
}

Hex values

Color 1#E0C2A0

Color 2#F7DFB1

Color 3#A5CDA6

Color 4#639E92

Color 5#3A666D

Accessibility

Contrast checker

1.3:1Fail

1:1Fail

1.8:1Fail

3.8:1AA18

1.3:1Fail

1.4:1Fail

2.4:1Fail

4.9:1AA

1:1Fail

1.4:1Fail

1.7:1Fail

3.6:1AA18

1.8:1Fail

2.4:1Fail

1.7:1Fail

2.1:1Fail

3.8:1AA18

4.9:1AA

3.6:1AA18

2.1:1Fail

Similar palettes

More like Desert Oasis Bloom