Back to palettes

Palette

Silver Birch Whispers

A serene grayscale capturing the pale bark and gentle presence of a silver birch forest.

monochromecalm5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Silver Birch Whispers 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 Silver Birch Whispers.

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

Data visualization

#E0E0E0#C7C7C7#AFAFAF#8C8C8C#6A6A6A

Palette guide

How to use Silver Birch Whispers

Overview

The Silver Birch Whispers palette offers a serene grayscale collection, perfectly capturing the delicate essence of birch bark and the gentle calm of a forest. Featuring five harmonious shades from the airy #E0E0E0 to the grounding #6A6A6A, alongside versatile mid-tones like #C7C7C7, #AFAFAF, and #8C8C8C. This palette provides designers and developers with a refined foundation for projects demanding understated elegance and a natural, soothing aesthetic. Its monochrome nature ensures seamless integration and focus on form and texture, making it ideal for creating sophisticated, minimalist visual experiences.

Best used for

  • Minimalist website design
  • Architectural visualization and portfolios
  • Luxury brand identity
  • E-commerce for high-end products
  • Fine art photography backdrops
  • Interior design mood boards

Suggested color roles

primary

Use #AFAFAF as a versatile core color for main sections or prominent UI elements, balancing lightness and depth.

secondary

Employ #C7C7C7 for supporting content, secondary navigation, or as a lighter complement to the primary shade.

accent

Apply #6A6A6A for strong accents, important calls-to-action, or to provide necessary depth and contrast.

background

Utilize #E0E0E0 as a clean, expansive background to evoke spaciousness and allow other elements to breathe.

text

For optimal readability, use #6A6A6A or #8C8C8C for body text on lighter backgrounds like #E0E0E0 or #C7C7C7.

Accessibility notes

  • Ensure sufficient contrast between text and background, particularly for lighter shades like #AFAFAF on #E0E0E0.
  • Use #6A6A6A or #8C8C8C for primary body text on light backgrounds to meet WCAG AA standards.
  • Reserve very light shades like #E0E0E0 for large headings or decorative elements if used on lighter backgrounds.
  • Test all color pairings with WCAG contrast checkers for AA and AAA compliance, especially for interactive elements.

Recommended combinations

Light Fade

Creates a soft, ethereal gradient suitable for backgrounds, headers, or subtle layering.

#E0E0E0 · #C7C7C7 · #AFAFAF

Contrast Duo

Provides a strong, clear contrast ideal for text on background, or distinct UI components.

#E0E0E0 · #6A6A6A · #C7C7C7

Mid-Tone Depth

Offers a subtle, sophisticated progression for cards, panels, or layered information displays.

#C7C7C7 · #AFAFAF · #8C8C8C

CSS variables

:root {
  --silver-birch-whispers-1: #E0E0E0;
  --silver-birch-whispers-2: #C7C7C7;
  --silver-birch-whispers-3: #AFAFAF;
  --silver-birch-whispers-4: #8C8C8C;
  --silver-birch-whispers-5: #6A6A6A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "silver-birch-whispers": {
        1: "#E0E0E0",
        2: "#C7C7C7",
        3: "#AFAFAF",
        4: "#8C8C8C",
        5: "#6A6A6A",
      }
    }
  }
}

Related searches

grayscale color schemeserene grey palettenatural monochrome designsilver birch inspired colorscalm neutral tones

Palette colors

Hex values

Color 1#E0E0E0
·
Color 2#C7C7C7
·
Color 3#AFAFAF
·
Color 4#8C8C8C
·
Color 5#6A6A6A
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.5:1Fail
4.1:1AA18
2
1.3:1Fail
1.3:1Fail
2:1Fail
3.2:1AA18
3
1.7:1Fail
1.3:1Fail
1.5:1Fail
2.5:1Fail
4
2.5:1Fail
2:1Fail
1.5:1Fail
1.6:1Fail
5
4.1:1AA18
3.2:1AA18
2.5:1Fail
1.6:1Fail

Similar palettes

More like Silver Birch Whispers

View all monochrome