A design philosophy rooted in Japanese karesansui gardens -- where emptiness is meaningful, restraint is strength, and every element exists with intention.
Begin the pathType as calligraphy viewed from a distance -- elegant, deliberate, and never rushed. Generous line-height and thin weights embody the principle of ma.
Display / Cormorant Garamond Light
Stillness Speaks
Heading / Noto Serif Display Light
Refined Simplicity
Subheading / Work Sans Medium
Subtlety & Structure
Body / Work Sans Light
Generous line-height creates breathing room within paragraphs, embodying the principle of ma at the typographic level. Every word earns its place.
Caption / DM Sans Regular
Metadata, timestamps, and secondary information rendered with quiet precision.
Pull Quote / Cormorant Garamond Italic
"The space between things defines the things themselves."
Cormorant Garamond + Work Sans
Serene editorial -- the canonical Zen Garden pairing
Noto Serif Display + Inter
Refined simplicity -- modern with classical undertones
Cormorant Garamond + Inter
Contemplative minimalism -- elegant contrast with neutral body
Colors drawn from the materials of a karesansui garden: raked gravel, weathered granite, aged wood, and the quiet green of temple moss.
Each component is a stone placed with intention -- minimal, grounded, and defined by the space around it.
Minimal cards with barely-there borders and subtle elevation on hover. Separation comes from spacing, not visible lines.
A single green accent used sparingly for links, active states, and focal points. One color, maximum impact through restraint.
Transparent on load, revealing a frosted-glass backdrop on scroll. Fixed, minimal, and architecturally grounded like a torii gate.
Incomplete brush-stroke circles used as section dividers and background elements. The broken arc embodies wabi-sabi imperfection.
Fine parallel lines at near-invisible opacity evoke raked garden gravel. Water ripple variants use concentric radial gradients.
Asymmetric two-column layouts at 5:7 ratio. Content columns never exceed 720px. Whitespace occupies 60-70% of the viewport.
Classical Zen principles mapped to digital design decisions.
The pause between elements is not absence but presence. Whitespace communicates calm, importance, and respect for content. Margins of 6-10rem between sections create meditative pacing.
Strip every element to its core purpose. If it can be removed without losing meaning, remove it. The result of reduction is not emptiness but clarity.
Perfect symmetry feels rigid and artificial. Offset compositions at the 1/3 or 2/3 mark create organic visual interest and the subtle tension that makes a layout feel alive.
The cumulative effect of all principles is stillness and focus. If any element creates visual noise or anxiety, it does not belong. The interface should feel like a quiet room with natural light.
All the contemplative techniques of the karesansui garden, built with pure CSS -- no image assets needed.
Fine parallel lines at low opacity evoke gravel raked into flowing water patterns.
Concentric radial gradients suggest the circular patterns raked around garden stones.
Rounded shapes in muted tones anchor compositions like stones in a dry garden.
Incomplete circles created with border-radius and transparent segments for wabi-sabi warmth.
Subtle green-tinted gradients suggest moss growing on stone surfaces.
Thin geometric borders evoke the translucent paper panels of traditional Japanese architecture.
Quiet, understated, action through restraint. Each button earns its place through purpose, not decoration.
"In the beginner's mind there are many possibilities, but in the expert's mind there are few."
Shunryu Suzuki
Every journey toward simplicity begins with a single step. Let emptiness guide your next design -- strip away the unnecessary until only clarity remains.
Return to Stillness