Palette

Stone Hearth Comfort

A sophisticated range of greys, mirroring the quiet strength and timeless elegance of natural stone.

neutralminimal5 colors

More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Stone Hearth Comfort 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 Stone Hearth Comfort.

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

Data visualization

#4F4F4F#8F8F8F#CFCFCF#EAEAEA#2D2D2D

Palette guide

How to use Stone Hearth Comfort

Overview

The Stone Hearth Comfort palette offers a sophisticated range of greys, mirroring the quiet strength and timeless elegance of natural stone. This collection spans from the deep, anchoring #2D2D2D and #4F4F4F, through the balanced #8F8F8F, to the light and airy #CFCFCF and #EAEAEA. It's a versatile choice for designers and developers seeking to create modern, minimalist, yet inviting digital experiences. These harmonious neutrals are perfect for crafting elegant user interfaces, sophisticated branding, and architectural presentations that require a grounded, comfortable, and refined aesthetic.

Best used for

Modern minimalist web design
High-end real estate marketing
Luxury brand identity
Professional corporate interfaces
Interior design applications
Elegant portfolio websites

Suggested color roles

primary

#4F4F4F - A deep, robust grey, excellent for main content areas, headers, or prominent UI elements, providing a strong, sophisticated anchor.

secondary

#8F8F8F - A balanced mid-grey, suitable for secondary information, subheadings, or subtle background variations in cards or panels.

accent

#2D2D2D - The darkest shade, perfect for strong calls to action, critical icons, or to define borders and dividers with sharp elegance.

background

#EAEAEA - A very light, near-white grey that provides a clean, bright, and inviting canvas for content, softer than pure white.

text

#2D2D2D - This deep, almost black grey offers exceptional contrast against #EAEAEA or #CFCFCF, ensuring optimal readability for all text elements.

Accessibility notes

Ensure good contrast for text in #8F8F8F against #EAEAEA or #CFCFCF, especially for body text; aim for WCAG AA.
The darkest shade, #2D2D2D, is ideal for all critical text to ensure maximum readability on light backgrounds.
Avoid using #CFCFCF or #EAEAEA for text unless it's very large display text on a dark background, which is not typical for this palette.
For interactive elements, ensure hover/focus states provide clear visual changes using #4F4F4F or #2D2D2D.

Recommended combinations

Modern Base

Creates a clean, layered background for content, with #4F4F4F for prominent headings.

#EAEAEA · #CFCFCF · #4F4F4F

Deep Clarity

Excellent for cards or panels, where #2D2D2D provides strong text on a light background with #8F8F8F for details.

#8F8F8F · #2D2D2D · #EAEAEA

Subtle Structure

Ideal for defining UI sections or progressive disclosure, maintaining a sophisticated, understated feel.

#4F4F4F · #8F8F8F · #CFCFCF

CSS variables

:root {
  --stone-hearth-comfort-1: #4F4F4F;
  --stone-hearth-comfort-2: #8F8F8F;
  --stone-hearth-comfort-3: #CFCFCF;
  --stone-hearth-comfort-4: #EAEAEA;
  --stone-hearth-comfort-5: #2D2D2D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "stone-hearth-comfort": {
        1: "#4F4F4F",
        2: "#8F8F8F",
        3: "#CFCFCF",
        4: "#EAEAEA",
        5: "#2D2D2D",
      }
    }
  }
}

Hex values

Color 1#4F4F4F

Color 2#8F8F8F

Color 3#CFCFCF

Color 4#EAEAEA

Color 5#2D2D2D

Accessibility

Contrast checker

2.5:1Fail

5.3:1AA

6.8:1AA

1.7:1Fail

2.5:1Fail

2.1:1Fail

2.7:1Fail

4.3:1AA18

5.3:1AA

2.1:1Fail

1.3:1Fail

8.8:1AAA

6.8:1AA

2.7:1Fail

1.3:1Fail

11.4:1AAA

1.7:1Fail

4.3:1AA18

8.8:1AAA

11.4:1AAA

Similar palettes

More like Stone Hearth Comfort

View all neutral

Metro Grid Hues

Minimalist Gallery Wall

Minimalist Stone Carve

Smoky Quartz Hues

Ancient Roman Stone

Ancient Rune Stone