和の美意識/侘び寂び デザインインスピレーション
不完全さの中にこそ美がある。枯山水の砂紋、障子越しの光、茶室の静寂 -- 日本の美意識「侘び寂び」は、西洋のデザイン原則とは根本的に異なる。余白は「何もない空間」ではなく「間(ま)」として雄弁に語り、非対称なレイアウトが動的なバランスを生む。このページでは、和の美意識に基づくデザインシステムを豊富なビジュアル例とともに解説する。
このページの使い方
各セクションにインラインHTMLのビジュアル例を配置しています。和紙色の背景、墨色のテキスト、縦書きの美しさを画面上で体感してください。
デザイン哲学 -- 間(ま)は語る
何も置かないことが、最も雄弁なデザインである。
侘び寂びの核心は「不完全さの受容」。完璧な対称を求めず、均等な配分を避け、あえて非対称に、あえて余白を大きく取る。その「不在」が逆に存在感を生む。
カラーパレット -- 和の色名
COLOR PALETTE
| Token | 値 | 役割 |
|---|---|---|
| bg-washi | #f7f3eb | メイン背景（和紙） |
| bg-kinari | #ebe5d6 | セクション背景（生成り） |
| bg-sumi | #2d2a24 | ダーク背景（墨色） |
| text-sumi | #2d2a24 | メインテキスト |
| text-usuzumi | #5a5549 | サブテキスト |
| accent-shu | #8b4513 | 朱色アクセント |
| accent-matcha | #4a6741 | 抹茶色アクセント |
| accent-kin | #c9a96e | 金色装飾 |
縦書きの美学
日本語の縦書きは、デザイン要素として独自の美しさを持つ。タイトル、サイドバー、引用文に効果的に使用する。
花鳥風月
季節を愛でる
日本人は古来より、自然の移ろいの中に美を見出してきた。桜の儚さ、紅葉の鮮やかさ、雪の静寂。その一瞬一瞬を慈しむ心が、侘び寂びの根底にある。
コンポーネント -- 控えめな主張
ボタンバリエーション
Primary
Accent
Ghost
引用カード
「茶の湯とは、ただ湯を沸かし、茶を点てて飲むばかりなる事と知るべし」
千利休
非対称レイアウト -- 動的なバランス
侘び寂びでは対称を避ける。7:5、6:4 の非均等分割が、静的な安定ではなく動的なバランスを生む。
7 : 5 の比率。広い側にコンテンツ。
狭い側に補助要素。
6 : 4 の比率。
余白を語らせる。
余白（間）の段階
| Token | 値 | 用途 |
|---|---|---|
| space-sm | 16px | カード内要素間 |
| space-md | 32px | カードパディング |
| space-lg | 64px | セクション間 |
| space-xl | 96px | 大セクション間 |
| space-hero | 128px | ヒーロー周辺 |
和の色彩 -- 季節を映す
SEASONAL COLORS
桜
若葉
藍
紅葉
枯葉
雪
使い方ガイド
Stitch への投入方法
/Users/takehiro/Documents/WorkSpace/otani/Skills/create-design/templates/JAPANESE_WABISABI.mdをプロジェクトのDESIGN.mdにコピー- 季節に合わせたアクセントカラーを選択
- Stitch に「この DESIGN.md に従って [画面名] を作成してください」と指示
適したプロジェクト
- 旅館・茶室のウェブサイト
- 和食レストランのLP
- 伝統工芸品のECサイト
- 日本文化関連のポートフォリオ
- 着物・和装のブランドサイト
不向きなプロジェクト
- テック系SaaSのダッシュボード
- ゲーミング・eスポーツ系
- ポップなSNS系サービス
- 速度重視のニュースサイト
縦書きの注意
writing-mode: vertical-rl はモバイル(640px以下)で horizontal-tb にフォールバックしてください。縦書きは大画面での装飾的使用に限定することを推奨します。