Back to palettes

Palette

Wabi Sabi Simplicity

Subtly varied off-whites and greys embrace the understated beauty of imperfection and natural aging.

neutralminimal5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Wabi Sabi Simplicity 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 Wabi Sabi Simplicity.

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

Data visualization

#EBEAE0#D1D1C4#B7B7AB#9D9D92#838379

Palette guide

How to use Wabi Sabi Simplicity

Overview

The Wabi Sabi Simplicity palette embodies understated elegance with its subtly varied off-whites and greys, reflecting the beauty of imperfection and natural aging. Featuring a harmonious gradient from near-white #EBEAE0 and #D1D1C4, through soothing #B7B7AB and #9D9D92, to the grounding #838379, this collection promotes serenity and minimalism. It's ideal for designers and developers aiming to create refined, peaceful, and sophisticated digital or physical spaces. This palette effectively conveys a sense of calm, authenticity, and enduring beauty, perfect for projects seeking a quiet, thoughtful aesthetic.

Best used for

  • Spa and wellness branding
  • Minimalist website design
  • Luxury textile presentations
  • Art gallery interiors
  • Serene meditation apps
  • Sustainable fashion brands

Suggested color roles

primary

Use #B7B7AB as a soft, central color for content blocks or subtle UI elements, maintaining calm.

secondary

Apply #D1D1C4 for supporting backgrounds or secondary information, offering gentle variation.

accent

Reserve #838379 for subtle accents or important text that needs to stand out without being harsh.

background

Employ #EBEAE0 as the primary background color, providing a clean, airy, and inviting canvas.

text

For optimal readability, use #838379 or a dark charcoal grey for body text on any of the lighter shades. Black for headings can work.

Accessibility notes

  • Crucial to ensure sufficient contrast between text and background due to the subtle variations in lightness.
  • Always use the darkest shades like #838379 for body text to ensure readability on lighter backgrounds.
  • Avoid using #D1D1C4 or #B7B7AB for small text on similar light backgrounds.
  • Test all text and interactive element color pairings with accessibility tools to meet WCAG contrast guidelines.

Recommended combinations

Gentle Gradient

Creates a soft, seamless transition, ideal for backgrounds or layered UI elements for a calming effect.

#EBEAE0 · #D1D1C4 · #B7B7AB

Understated Contrast

Provides clear readability for text and subheadings, maintaining the minimalist aesthetic.

#EBEAE0 · #9D9D92 · #838379

Serene Base

Excellent for content cards or sections, offering subtle depth without overpowering the design.

#D1D1C4 · #B7B7AB · #9D9D92

CSS variables

:root {
  --wabi-sabi-simplicity-1: #EBEAE0;
  --wabi-sabi-simplicity-2: #D1D1C4;
  --wabi-sabi-simplicity-3: #B7B7AB;
  --wabi-sabi-simplicity-4: #9D9D92;
  --wabi-sabi-simplicity-5: #838379;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "wabi-sabi-simplicity": {
        1: "#EBEAE0",
        2: "#D1D1C4",
        3: "#B7B7AB",
        4: "#9D9D92",
        5: "#838379",
      }
    }
  }
}

Related searches

wabi-sabi grey paletteminimalist neutral colorsserene earth tonessubtle off-white schemeorganic grey hues

Palette colors

Hex values

Color 1#EBEAE0
·
Color 2#D1D1C4
·
Color 3#B7B7AB
·
Color 4#9D9D92
·
Color 5#838379
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.3:1Fail
3.2:1AA18
2
1.3:1Fail
1.3:1Fail
1.8:1Fail
2.5:1Fail
3
1.7:1Fail
1.3:1Fail
1.4:1Fail
1.9:1Fail
4
2.3:1Fail
1.8:1Fail
1.4:1Fail
1.4:1Fail
5
3.2:1AA18
2.5:1Fail
1.9:1Fail
1.4:1Fail

Similar palettes

More like Wabi Sabi Simplicity

View all neutral
Charcoal Smolder
Concrete Bloom Resilient
Dusky Harbor Stone
Linen Field Whisper
Linen Fresh
Minimal Silent Canvas