Palette

Desert Starlight Path

Evoking the vast, warm silence of a desert night with a sky full of stars.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Desert Starlight Path 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 Starlight Path.

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

Data visualization

#B38F76#E0C79A#5D4037#A16A4A#FFEEDB

Palette guide

How to use Desert Starlight Path

Overview

The "Desert Starlight Path" palette evokes the vast, warm silence of a desert night, offering a collection of soft, earthy tones reminiscent of sand and starlight. Deep browns like #5D4037 and #A16A4A ground the palette, while the inviting #B38F76 and #E0C79A introduce the warm glow of desert sand under moonlight. The luminous #FFEEDB provides a near-white highlight, bringing a subtle, ethereal touch. This natural and warm palette is ideal for designers seeking to create serene, comforting, and authentic experiences. It's perfectly suited for branding, web design, or editorial content that aims for a gentle, yet sophisticated and earthy aesthetic.

Best used for

Spa and wellness brand identity
Eco-tourism websites and brochures
Natural fiber product packaging
Rustic chic interior design
Photography portfolios for landscapes
Relaxation or meditation apps

Suggested color roles

primary

#A16A4A - A warm, inviting russet brown, serving as a strong, natural brand foundation.

secondary

#B38F76 - A soft, mid-tone sandy beige for supporting elements, larger content blocks, or subtle backgrounds.

accent

#FFEEDB - A luminous, near-white for highlights, delicate text, or ethereal design elements.

background

#5D4037 - A deep, rich chocolate brown, providing a grounding and luxurious backdrop.

text

#E0C79A - For legible text on dark backgrounds, or a deep charcoal for general body text on lighter areas.

Accessibility notes

Ensure #FFEEDB (light) has sufficient contrast when paired with #5D4037 or #A16A4A (dark) for text.
Avoid using #E0C79A directly on #B38F76 for small text; the contrast may be insufficient.
For optimal readability, use #5D4037 or #A16A4A for text on the lighter colors like #FFEEDB or #E0C79A.
Always check WCAG guidelines for all interactive elements and critical text for optimal accessibility.

Recommended combinations

Sandy Glow

Creates a soft, luminous background or a subtle gradient, perfect for serene web sections.

#FFEEDB · #E0C79A · #B38F76

Desert Night

A grounding combination for primary sections, providing depth and natural warmth.

#5D4037 · #A16A4A · #E0C79A

Path Marker

A high-contrast pairing for clear navigation, buttons, or important calls to action.

#B38F76 · #FFEEDB · #5D4037

CSS variables

:root {
  --desert-starlight-path-1: #B38F76;
  --desert-starlight-path-2: #E0C79A;
  --desert-starlight-path-3: #5D4037;
  --desert-starlight-path-4: #A16A4A;
  --desert-starlight-path-5: #FFEEDB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "desert-starlight-path": {
        1: "#B38F76",
        2: "#E0C79A",
        3: "#5D4037",
        4: "#A16A4A",
        5: "#FFEEDB",
      }
    }
  }
}

Hex values

Color 1#B38F76

Color 2#E0C79A

Color 3#5D4037

Color 4#A16A4A

Color 5#FFEEDB

Accessibility

Contrast checker

1.8:1Fail

3.2:1AA18

1.5:1Fail

2.6:1Fail

1.8:1Fail

5.7:1AA

2.7:1Fail

1.4:1Fail