Washi Quiet
Japanese washi minimalism: fibrous paper, a fine Mincho, sumi ink and one vermilion seal.
This style
$9$19
One-time, no subscription · instant download · client use · 7-day refund before download
The idea
A page that feels like handmade kōzo paper held up to soft light. Warm off-white with visible fibres, a delicate Mincho for headings, sumi-black text and a single vermilion seal mark. Asymmetric, with emptiness treated as part of the composition — ma, the space between.
Washi Quiet translates Japanese paper craft and the aesthetic of ma — meaningful emptiness — into a web page. It draws on traditional washi, tea ceremony utensils and the asymmetry of ikebana. A refined Mincho with generous tracking carries headings at modest sizes; a gentle gothic handles reading. Sumi black and warm paper fill almost everything, and a single vermilion seal (hanko) marks the one thing that matters. Layout is deliberately off-balance: content leans to one side and leaves the rest empty.
Principles
- Emptiness is composition — leave at least 40% of the hero unused.
- Asymmetry over symmetry; never centre the hero.
- One vermilion seal per page, no more.
- Modest type sizes with generous tracking and leading.
- Natural materials only in imagery: paper, clay, wood, leaves.
Motion
Text emerges from a 6px blur over 1.8 seconds, like ink soaking into paper. Links shift 4px to the right on hover, unhurried.
Do & don't
Do
- ✓ Leave the left or right 40% of the hero empty.
- ✓ Track Mincho headings at +0.04em.
- ✓ Use a single vermilion seal next to the wordmark.
Don't
- ✕ Don't centre the hero.
- ✕ Don't use vermilion for buttons or backgrounds.
- ✕ Don't set headings larger than 56px.
+ 3 more of each, and component rules, in the full DESIGN.md.
What's in the DESIGN.md
- 01Overview & principles
- 02Colors (tokens + proportions)
- 03Typography (families + 12-role scale)
- 04Layout & spacing scale
- 05Elevation & depth
- 06Shapes & radii
- 07Motion (easing, durations, signature)
- 08Imagery + generation prompt
- 09Components (button, card, nav, input, badge)
- 10Do's and don'ts
- 11Responsive behaviour
- 12Iteration guide + agent checklist
Plus theme.css (Tailwind v4 @theme), tokens.json (W3C) and the preview page source — 363 lines of DESIGN.md in total.
More like this
All Swiss & Minimal →
Nordic Calm
No. 031Scandinavian winter light: cool greys, frost blue, soft corners and a lot of air.
Pure Mono
No. 032Black on white, nothing else: a grotesk, thick rules and a bento of pure contrast.
Swiss Poster
No. 033An International Style concert poster: strict grid, flush-left grotesk, red and black.
Bauhaus Primary
No. 051Bauhaus workshop primaries: circle, square, triangle in red, yellow and blue on bone.
Cobalt Ink
No. 052One ink only: every line, word and shape printed in cobalt blue on bright paper.
Functionalist Sixties
No. 0531960s functionalist hardware: warm white housings, one orange switch, a grid of controls.