Back to palettes

Palette

Whisper Clay Earth

A serene collection of barely-there natural tones, embodying the gentle calmness of untouched earthy textures.

minimalminimal5 colors
More minimal palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Whisper Clay Earth 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 Whisper Clay Earth.

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

Data visualization

#E8E4D7#D7D0BF#BDB8AA#8C8880#F5F5DC

Palette guide

How to use Whisper Clay Earth

Overview

The Whisper Clay Earth palette offers a serene collection of barely-there natural tones, embodying gentle calmness and untouched earthy textures. With its lightest shade #F5F5DC and slightly deeper #E8E4D7, this palette is ideal for creating minimalist, clean, and soft designs. The mid-tone #BDB8AA provides subtle depth, making it versatile for backgrounds, gentle accents, or foundational elements. Perfect for projects that aim for a tranquil, sophisticated, and understated aesthetic, Whisper Clay Earth delivers a harmonious blend that feels organic and inviting across various applications.

Best used for

  • Minimalist website designs
  • Spa and wellness branding
  • Eco-friendly product packaging
  • Calm interior design concepts
  • Art and photography portfolios
  • Soft, neutral UI/UX themes

Suggested color roles

primary

#D7D0BF - A versatile, soft neutral that can serve as a main background or core brand color.

secondary

#BDB8AA - A slightly deeper, grounding tone for subheadings, borders, or subtle graphic elements.

accent

#8C8880 - The darkest shade, providing a gentle contrast for small details or interactive elements.

background

#F5F5DC - The lightest and most airy color, ideal for expansive backgrounds to create an open feel.

text

#8C8880 - A soft, readable charcoal-like tone for body text on lighter backgrounds like #F5F5DC or #E8E4D7.

Accessibility notes

  • Ensure sufficient contrast for text, especially when using lighter shades for both text and background.
  • Use #8C8880 for all primary text on #F5F5DC or #E8E4D7 backgrounds to meet WCAG AA standards.
  • Avoid using #D7D0BF or #BDB8AA for text on similar light backgrounds due to low contrast.
  • Consider using a slightly darker charcoal or black for very small text elements if legibility is critical.

Recommended combinations

Soft Foundation

Creates an airy, expansive feel, perfect for minimalist backgrounds and large content blocks.

#F5F5DC · #E8E4D7 · #D7D0BF

Earthy Depth

Provides gentle layering and contrast, suitable for navigation, footers, or subtle branding.

#D7D0BF · #BDB8AA · #8C8880

Tranquil Accent

A balanced combination for highlighting key information or creating a calm visual hierarchy.

#E8E4D7 · #8C8880 · #BDB8AA

CSS variables

:root {
  --whisper-clay-earth-1: #E8E4D7;
  --whisper-clay-earth-2: #D7D0BF;
  --whisper-clay-earth-3: #BDB8AA;
  --whisper-clay-earth-4: #8C8880;
  --whisper-clay-earth-5: #F5F5DC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "whisper-clay-earth": {
        1: "#E8E4D7",
        2: "#D7D0BF",
        3: "#BDB8AA",
        4: "#8C8880",
        5: "#F5F5DC",
      }
    }
  }
}

Related searches

minimalist earth tone palettecalm neutral colorssoft clay color schemenatural beige palettesubtle warm neutrals

Palette colors

Hex values

Color 1#E8E4D7
·
Color 2#D7D0BF
·
Color 3#BDB8AA
·
Color 4#8C8880
·
Color 5#F5F5DC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.6:1Fail
2.8:1Fail
1.1:1Fail
2
1.2:1Fail
1.3:1Fail
2.3:1Fail
1.4:1Fail
3
1.6:1Fail
1.3:1Fail
1.8:1Fail
1.8:1Fail
4
2.8:1Fail
2.3:1Fail
1.8:1Fail
3.2:1AA18
5
1.1:1Fail
1.4:1Fail
1.8:1Fail
3.2:1AA18

Similar palettes

More like Whisper Clay Earth

View all minimal
Coastal Driftwood Grey
Pebble Garden Calm
Modernist Concrete Slab
Zen Stone Garden
Cool Linen Comfort
Adobe Sunstone Hues