Back to palettes

Palette

Riverbed Smooth Stone

A collection of understated grays, like smooth, cool stones worn by a gentle river current.

neutralminimal5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Riverbed Smooth Stone 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 Riverbed Smooth Stone.

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

Data visualization

#A8A8A8#C4C4C4#DFDFDF#F0F0F0#8F8F8F

Palette guide

How to use Riverbed Smooth Stone

Overview

The Riverbed Smooth Stone palette offers a collection of understated grays, reminiscent of cool, water-worn stones. With shades ranging from the grounding #8F8F8F to the almost-white #F0F0F0, and including the versatile #A8A8A8, this palette is a minimalist's dream. Designers can craft clean, uncluttered interfaces, allowing content to take center stage, while developers will appreciate the clear value hierarchy for structuring layouts. The subtle differences between #C4C4C4 and #DFDFDF provide just enough variation for depth without introducing distraction, making it ideal for elegant and modern applications that prioritize clarity and refinement.

Best used for

  • Minimalist web and app interfaces
  • High-end photography portfolios
  • Modern art gallery websites
  • Luxury product showcases
  • Elegant print media and stationery
  • Clean corporate branding

Suggested color roles

primary

Utilize #A8A8A8 for main structural elements, providing a solid yet unobtrusive foundation.

secondary

Apply #C4C4C4 for supporting panels, subtle dividers, or backgrounds of secondary information.

accent

Use #8F8F8F sparingly for strong emphasis, outlines, or important icons, adding a touch of visual weight.

background

Employ #F0F0F0 as the primary background color, offering a bright, clean canvas.

text

A dark charcoal or black provides optimal readability against the light grays, for example, #8F8F8F for headings and a true black for body text.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using lighter grays. Dark grey or black text on #F0F0F0 or #DFDFDF is critical.
  • Avoid using #C4C4C4 or #DFDFDF for small text on #F0F0F0 backgrounds, as contrast will be too low.
  • For interactive elements, consider using a darker shade like #8F8F8F for hover states to indicate interaction clearly.
  • A contrast checker is essential for validating all text-background pairings within this subtle palette.

Recommended combinations

Core Minimalism

Excellent for a primary content block: #F0F0F0 background, #A8A8A8 for cards, and #8F8F8F for headings.

#8F8F8F · #F0F0F0 · #A8A8A8

Layered Neutrals

Ideal for creating subtle depth in UI elements like modals or tooltips, using progressive lightness.

#C4C4C4 · #DFDFDF · #A8A8A8

Bright & Bold

A crisp combination for hero sections: #F0F0F0 background, #8F8F8F for strong text, #A8A8A8 for supporting elements.

#F0F0F0 · #8F8F8F · #A8A8A8

CSS variables

:root {
  --riverbed-smooth-stone-1: #A8A8A8;
  --riverbed-smooth-stone-2: #C4C4C4;
  --riverbed-smooth-stone-3: #DFDFDF;
  --riverbed-smooth-stone-4: #F0F0F0;
  --riverbed-smooth-stone-5: #8F8F8F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "riverbed-smooth-stone": {
        1: "#A8A8A8",
        2: "#C4C4C4",
        3: "#DFDFDF",
        4: "#F0F0F0",
        5: "#8F8F8F",
      }
    }
  }
}

Related searches

minimalist grey paletteneutral UI colorssubtle stone color schemeclean web design greymodern monochrome palette

Palette colors

Hex values

Color 1#A8A8A8
·
Color 2#C4C4C4
·
Color 3#DFDFDF
·
Color 4#F0F0F0
·
Color 5#8F8F8F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.8:1Fail
2.1:1Fail
1.4:1Fail
2
1.4:1Fail
1.3:1Fail
1.5:1Fail
1.9:1Fail
3
1.8:1Fail
1.3:1Fail
1.2:1Fail
2.4:1Fail
4
2.1:1Fail
1.5:1Fail
1.2:1Fail
2.8:1Fail
5
1.4:1Fail
1.9:1Fail
2.4:1Fail
2.8:1Fail

Similar palettes

More like Riverbed Smooth Stone

View all neutral
Ancient Rune Stone
Calm Interior Lines
Calm Stone Pathway
Cloudy Cobblestone Lane
Minimalist Stone Carve
Nordic Calm Retreat