Back to palettes

Palette

Zen Stone Pathway

A serene and balanced palette inspired by the quiet beauty of a Japanese rock garden and its natural elements.

neutralminimal5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Zen Stone Pathway 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 Zen Stone Pathway.

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

Data visualization

#708090#A9A9A9#C0C0C0#5F9EA0#D3D3D3

Palette guide

How to use Zen Stone Pathway

Overview

The Zen Stone Pathway palette offers a grounded and serene collection of cool grays and a refreshing blue-green, ideal for creating balanced and inviting digital and physical spaces. With a deep slate gray #708090, a classic medium gray #A9A9A9, and the distinctive cadet blue #5F9EA0, this palette evokes the quiet strength of natural stone and calm waters. Developers can use the lighter #D3D3D3 and #C0C0C0 for clean backgrounds and subtle UI elements, ensuring excellent readability and a harmonious user experience. This palette is perfect for projects that aim for a calm, yet sophisticated, presence.

Best used for

  • Architectural firm branding
  • Interior design inspiration boards
  • Environmental non-profit websites
  • Calm and meditative app interfaces
  • Urban planning presentations
  • Sustainable living product lines

Suggested color roles

primary

#708090 provides a strong, anchoring presence for main headings, navigation, or primary calls to action.

secondary

#A9A9A9 is versatile for secondary elements, borders, or subtle background patterns, offering a neutral balance.

accent

#5F9EA0 serves as a refreshing accent, perfect for interactive elements, highlights, or graphical features that need a touch of calm color.

background

#D3D3D3 offers a clean, light base, ensuring content stands out and the overall feel is open and airy.

text

For readable text on light backgrounds, #708090 or a deep charcoal works effectively. For light text on darker elements, #D3D3D3 is suitable.

Accessibility notes

  • Ensure #708090 text on #D3D3D3 or #C0C0C0 backgrounds meets WCAG AA contrast.
  • #5F9EA0 as text might require larger sizes or sufficient contrast with its background, especially lighter grays.
  • Use #A9A9A9 for body text with lighter backgrounds like #D3D3D3 for good readability.
  • Be cautious when using #C0C0C0 as text on #D3D3D3 due to low contrast; best for subtle UI elements.

Recommended combinations

Stone & Water

A strong heading/text, clean background, and a refreshing accent for buttons or links.

#708090 · #D3D3D3 · #5F9EA0

Pathway Layers

Ideal for creating depth in UI elements, subtle gradients, or layered informational panels.

#A9A9A9 · #C0C0C0 · #708090

Tranquil Accent

A light canvas with a calming accent and a neutral supporting color for details.

#D3D3D3 · #5F9EA0 · #A9A9A9

CSS variables

:root {
  --zen-stone-pathway-1: #708090;
  --zen-stone-pathway-2: #A9A9A9;
  --zen-stone-pathway-3: #C0C0C0;
  --zen-stone-pathway-4: #5F9EA0;
  --zen-stone-pathway-5: #D3D3D3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "zen-stone-pathway": {
        1: "#708090",
        2: "#A9A9A9",
        3: "#C0C0C0",
        4: "#5F9EA0",
        5: "#D3D3D3",
      }
    }
  }
}

Related searches

calm gray blue green palettenatural stone color schemeserene ui design colorsminimalist pathway huestranquil architectural palette

Palette colors

Hex values

Color 1#708090
·
Color 2#A9A9A9
·
Color 3#C0C0C0
·
Color 4#5F9EA0
·
Color 5#D3D3D3
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.2:1Fail
1.3:1Fail
2.7:1Fail
2
1.7:1Fail
1.3:1Fail
1.3:1Fail
1.6:1Fail
3
2.2:1Fail
1.3:1Fail
1.7:1Fail
1.2:1Fail
4
1.3:1Fail
1.3:1Fail
1.7:1Fail
2:1Fail
5
2.7:1Fail
1.6:1Fail
1.2:1Fail
2:1Fail

Similar palettes

More like Zen Stone Pathway

View all neutral
Calm Stone Pathway
Pebble Zen Garden
Smooth Pebble Gradient
Stone Garden Zen
Stone Garden Zen
Tranquil Pebble Path