Back to palettes

Palette

Beach Stone Sketch

A simple, natural gradient of grays, evoking the smooth, rounded stones found on a tranquil beach.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Beach Stone Sketch 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 Beach Stone Sketch.

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

Data visualization

#B8B8B8#A3A3A3#8F8F8F#7B7B7B#666666

Palette guide

How to use Beach Stone Sketch

Overview

The Beach Stone Sketch palette offers a serene and minimalist gradient of cool grays, reminiscent of smooth, water-worn pebbles. This monochrome collection ranges from the lighter #B8B8B8 to the deeper #666666, providing subtle variations that create depth without overwhelming. Each hex code, like #A3A3A3 and #7B7B7B, contributes to a cohesive, sophisticated aesthetic. Designers and developers can leverage this palette for clean, modern interfaces or understated branding that requires a sense of calm and stability. Its versatility allows for seamless integration into corporate, architectural, or artistic projects where neutrality and elegance are paramount, facilitating focus on content or form.

Best used for

  • Modern corporate branding
  • Architectural visualization
  • Minimalist website designs
  • Photography portfolios
  • High-end product interfaces
  • Understated editorial layouts

Suggested color roles

primary

Utilize the mid-tone gray #8F8F8F for primary interactive elements, providing a subtle yet clear presence.

secondary

The darker #666666 is ideal for foundational elements such as footers, sidebars, or strong text, offering robust contrast.

accent

The lightest shade #B8B8B8 can act as a soft accent for borders, dividers, or very subtle highlights, maintaining minimalism.

background

Employ #A3A3A3 for content areas or main backgrounds to create a calm and professional canvas.

text

For optimal readability, use a dark gray like #666666 or black on lighter backgrounds such as #B8B8B8, or a lighter gray like #B8B8B8 on the darkest backgrounds.

Accessibility notes

  • Ensure sufficient contrast between adjacent grays, especially for text, by using a contrast checker.
  • Lightest gray #B8B8B8 should not be used for small text on #A3A3A3 without careful contrast checking.
  • All text on #666666 should be light-colored (e.g., white or #B8B8B8) for readability.
  • Monochromatic palettes can be tricky for distinguishing states; use clear visual cues beyond color.

Recommended combinations

Subtle Depth

Creates a sophisticated layered effect for interfaces, backgrounds, and content blocks.

#A3A3A3 · #7B7B7B · #B8B8B8

Strong Contrast

Excellent for defining clear hierarchies, such as dark text on a light background with a mid-tone accent.

#666666 · #B8B8B8 · #8F8F8F

Monochrome Base

Provides a versatile neutral base for web layouts, offering subtle variation for different sections.

#8F8F8F · #A3A3A3 · #7B7B7B

CSS variables

:root {
  --beach-stone-sketch-1: #B8B8B8;
  --beach-stone-sketch-2: #A3A3A3;
  --beach-stone-sketch-3: #8F8F8F;
  --beach-stone-sketch-4: #7B7B7B;
  --beach-stone-sketch-5: #666666;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "beach-stone-sketch": {
        1: "#B8B8B8",
        2: "#A3A3A3",
        3: "#8F8F8F",
        4: "#7B7B7B",
        5: "#666666",
      }
    }
  }
}

Related searches

monochrome gray paletteminimalist grey color schemecool neutral colorsstone inspired paletteweb design grey tones

Palette colors

Hex values

Color 1#B8B8B8
·
Color 2#A3A3A3
·
Color 3#8F8F8F
·
Color 4#7B7B7B
·
Color 5#666666
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.6:1Fail
2.1:1Fail
2.9:1Fail
2
1.3:1Fail
1.3:1Fail
1.7:1Fail
2.3:1Fail
3
1.6:1Fail
1.3:1Fail
1.3:1Fail
1.8:1Fail
4
2.1:1Fail
1.7:1Fail
1.3:1Fail
1.4:1Fail
5
2.9:1Fail
2.3:1Fail
1.8:1Fail
1.4:1Fail

Similar palettes

More like Beach Stone Sketch

View all monochrome
Ancient Stone Rubble
Basalt Stream Pebble
Calm Stone Meditate
Granite Mountain Peaks
Granite Peak Twilight
Historic Tablet Text