Ma Design System - The beauty of empty space
間 - 静寂 - 侘寂
In Japanese aesthetics, ma represents the pause between notes, the space between objects, the silence that gives meaning to sound. This design system embraces emptiness as a form of expression.
間
Negative space. The pause. What is not there defines what is.
侘寂
Beauty in imperfection. The worn, the weathered, the asymmetric.
簡素
Simplicity. Eliminate the unnecessary. Keep only what matters.
書体
Clean letterforms with generous spacing. Japanese and Western typefaces in harmonious balance.
Body text uses Noto Sans JP with light weight and generous line height. The goal is readability without distraction, allowing words to breathe on the page like ink settling on washi paper.
The Western companion typeface, Cormorant Garamond, brings classical elegance that harmonizes with Japanese aesthetics.
色彩
Earth tones, stone grays, and the rich blacks of sumi ink. Muted colors that calm the mind.
釦
Understated controls that invite interaction without demanding attention.
Hover states are subtle transitions rather than dramatic changes, maintaining the calm aesthetic.
札
Containers for content that float gently on the page, with subtle shadows suggesting depth without weight.
A simple container with clean borders and ample padding. Content breathes within the space provided.
The dark header draws from sumi-e ink gradients, creating a striking contrast with the light body.
A subtle red border on the left marks this as important, like a hanko seal on a document.
Gentle gradients suggest the weathered surface of garden stones, worn smooth by time.
One time, one meeting. Treasure each encounter.
The pathos of things. Awareness of impermanence.
Profound grace. Mystery beyond what can be seen.
入力
Input fields that invite focus through simplicity, with minimal borders that appear when needed.
We respect your privacy
表
Data presented with clarity and restraint. Information organized like stones in a garden.
| Element | Japanese | Meaning | Value |
|---|---|---|---|
| Earth | Chi | Stability and foundation | 1 |
| Water | Sui | Adaptability and flow | 2 |
| Fire | Ka | Energy and passion | 3 |
| Wind | Fu | Growth and freedom | 4 |
| Void | Ku | Emptiness and spirit | 5 |
| Five Elements - Godai | 15 | ||
| Season | Flower | Characteristic |
|---|---|---|
| Spring | Cherry Blossom | Transience |
| Summer | Lotus | Purity |
| Autumn | Chrysanthemum | Longevity |
| Winter | Plum | Perseverance |
通知
Notifications that inform without alarming. Status indicators as subtle as seasonal changes.
Take time to consider this information. Like water finding its path, let understanding come naturally.
Your changes have been saved successfully. The garden is in balance.
Please review the following items before proceeding. Mindfulness prevents mistakes.
This content has been archived. Like autumn leaves, it remains beautiful in memory.
Badges mark status with quiet confidence. They categorize and inform without drawing undue attention to themselves.