Back to palettes

Palette

River Stone Medley

A collection of cool, varied greys, like smooth pebbles found in a riverbed.

neutralnatural5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how River Stone Medley 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 River Stone Medley.

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

Data visualization

#A9A9A9#C0C0C0#808080#696969#484848

Palette guide

How to use River Stone Medley

Overview

The River Stone Medley palette brings together a collection of cool, varied greys, capturing the essence of smooth river pebbles. This versatile range, from the lighter #C0C0C0 to the deep #484848, provides a grounded yet sophisticated foundation for designs seeking a natural, earthy, and textured feel. Designers and developers can leverage the distinct mid-tones like #A9A9A9, #808080, and #696969 to create depth, subtle variations, and a cohesive, organic aesthetic across digital and print media.

Best used for

  • Natural product branding
  • Urban design concepts
  • Photography backdrops
  • Rustic-chic interior accents
  • Web design with an organic touch
  • Textured UI elements

Suggested color roles

primary

Utilize #808080 as a classic mid-grey primary, highly adaptable for main content and foundational elements.

secondary

Introduce #A9A9A9 as a lighter supporting grey for secondary information, subtle borders, or background variations.

accent

Apply #C0C0C0 as the lightest grey for gentle highlights, hover states, or clean separation in design.

background

Use #C0C0C0 for a clean, light base, or #A9A9A9 for a slightly deeper, soft background.

text

Employ #484848 as the darkest grey, ensuring excellent readability for body text and headings on lighter tones.

Accessibility notes

  • Ensure #484848 text provides good contrast on #C0C0C0 or #A9A9A9 backgrounds (WCAG AA).
  • Avoid using #808080 text on #A9A9A9 background for body copy due to potentially low contrast.
  • Consider using #C0C0C0 for large headings or graphic elements on #484848 for better visibility.
  • Maintain consistent contrast for interactive elements, especially when using similar grey tones.

Recommended combinations

Deep & Light

Creates a strong, clear contrast, ideal for primary content, calls to action, and clean layouts.

#484848 · #C0C0C0 · #A9A9A9

Mid-tone Harmony

Offers a balanced and sophisticated blend, perfect for subtle backgrounds, secondary information, or layered elements.

#808080 · #696969 · #A9A9A9

Smooth Stone

Provides a gentle, natural flow, suitable for elegant UI elements or serene branding where subtle transitions are desired.

#C0C0C0 · #A9A9A9 · #808080

CSS variables

:root {
  --river-stone-medley-1: #A9A9A9;
  --river-stone-medley-2: #C0C0C0;
  --river-stone-medley-3: #808080;
  --river-stone-medley-4: #696969;
  --river-stone-medley-5: #484848;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "river-stone-medley": {
        1: "#A9A9A9",
        2: "#C0C0C0",
        3: "#808080",
        4: "#696969",
        5: "#484848",
      }
    }
  }
}

Related searches

varied grey palettenatural stone colorsearthy grey schemetexture inspired palettegrounded neutral design

Palette colors

Hex values

Color 1#A9A9A9
·
Color 2#C0C0C0
·
Color 3#808080
·
Color 4#696969
·
Color 5#484848
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
2.3:1Fail
3.9:1AA18
2
1.3:1Fail
2.2:1Fail
3:1AA18
5:1AA
3
1.7:1Fail
2.2:1Fail
1.4:1Fail
2.3:1Fail
4
2.3:1Fail
3:1AA18
1.4:1Fail
1.7:1Fail
5
3.9:1AA18
5:1AA
2.3:1Fail
1.7:1Fail

Similar palettes

More like River Stone Medley

View all neutral
River Stone Calm
Ancient Ruin Stone
Ancient Temple Sandstone
Boho Earth Weave
Boho Macrame Weave
Coastal Cliff Path