Zhi纸
好內容，值得好版面。Zhi 用清晰的排版，讓文件更好讀。
00 · See it
輸出樣本
把文件需求交給 Claude。無論是一頁紙、長文、正式信件、作品集、履歷還是簡報，Zhi 都用少量清晰規則，把提示詞變成可交付的排版。同一份 brief 也能 交給繪圖模型，README 裡附了樣圖和可複製的提示詞。
履歷先選底板與頁數：預設純白、A4 一頁，可選暖米白或兩頁，照片依需求提供。完成後同時交付 HTML、PDF 與可編輯 DOCX。
Equity Report · 中文
Tesla 財報 · 3 頁
Resume · English
產品實習履歷，1 頁
一頁紙 · 中文
Zhi 介紹，白底列印版，1 頁
Slides · English
Agent keynote, 8 slides
Landing Pages
落地頁範例
Zhi 與精選第三方產品頁面，呈現同一套克制的視覺語言。外部產品保留各自的真實身分。
Zhi
設計系統主頁
Luo 落文
CJK 閱讀字體
Mole 鼴
macOS 系統工具
01 · Usage
安裝與調用
直接告訴 Claude 你要什麼，比如「幫我排版一份白皮書」「做一份履歷」「幫我做一份作品集」，skill 會自動觸發，無需斜線命令。
目前為私有內測，尚未正式發行。先取得儲存庫存取權，依照內測指引複製程式碼，再使用以下本機安裝指令。
# Authorized checkout gh auth login gh repo clone okht/zhi ./zhi # Claude Code (v2.1.142+) /plugin marketplace add ./zhi /plugin install zhi@zhi # Codex plugin marketplace codex plugin marketplace add ./zhi codex plugin add zhi@zhi
通用 agent：npx skills add ./zhi/plugins/zhi -a universal -g -y。從已複製的輕量外掛目錄安裝。
Claude Desktop 使用儲存庫內小於 6 MB 的 Slim zhi.zip。獲授權的內測使用者在本機建立 zhi-fonts-full.zip，再透過 bash scripts/ensure-fonts.sh 的 --bundle 參數安裝；本站不提供公開下載。
02 · Manifesto
設計原則
暖米紙底，油墨藍點綴，serif 承擔層級，硬陰影與花俏配色都退後；這套系統面向印刷文件，負責把內容收束成穩定、清晰、易讀的版面。履歷預設純白底，也可選暖米白；其他文件維持原有暖米紙底。
- 1
其他文件預設 parchment
#f5f4ed；履歷預設純白，可選暖米白 - 2
強調色只有油墨藍
#1B365D，不引入第二種彩色 - 3
所有灰色暖調 (yellow-brown undertone)，禁止冷藍灰
- 4
中文使用方正公文楷體，拉丁字元保留獨立 Charter 字體
- 5
一般文件正文 400、標題 500；履歷依樣本使用粗體
- 6
行距三檔：緊湊標題 1.1-1.3 / 密排 1.4-1.45 / 閱讀 1.5-1.55
- 7
Tag 背景必須實色 hex，禁止 rgba（WeasyPrint 雙層矩形 bug）
- 8
陰影只用 ring 或 whisper shadow，不用硬 drop shadow
03 · Color
暖調克制
唯一強調色、純暖調中性灰、零冷色；油墨藍全文件不超過 5% 面積，超過就從克制變成堆砌。
畫布 · Canvas
Parchment
頁面底色，也是整套設計的溫度來源
#F5F4EDIvory
卡片 · 浮起容器
#FAF9F5Warm Sand
按鈕預設背景 · 互動面
#E8E6DCDeep Dark
深色頁面底，保留橄欖色調
#141413主調 · Brand
Ink Blue
主色 · CTA · quote 豎線 · 章節標題
#1B365DInk Light
深色底連結 · 亮色
#2D5A8ADark Surface
深色主題容器 · 暖炭灰
#30302EError
錯誤，深暖紅，不刺眼
#B53333中性 · Warm Neutrals
Near Black
#141413Dark Warm
#3D3D3AOlive
#504e49Stone
#6b6a64Tag Tints · rgba → 實色對照
這裡列的是油墨藍 #1B365D 疊加在 parchment 上的等效實色；Tag 背景不使用 rgba()，避免 WeasyPrint 的雙層矩形問題。
0.08
#EEF2F70.14
#E4ECF50.18
#E4ECF50.22
#D0DCE90.30
#D6E1EE04 · Typography
字體系統
一般文件保持正文 400、標題 500；履歷的粗體與分隔符遵循參考樣本。
紙 Aa
Serif · 標題
公文楷體 / Charter
中文用方正公文楷體，英文用獨立 Charter；中文履歷姓名用方正新楷體。
</>
Mono · 代碼
JetBrains Mono
用於代碼塊、版本號、hex 值與等寬數字，字號較正文低一檔。
層級（印刷品 pt · 螢幕 px ≈ pt × 1.33）
清晰、穩定、有餘韻
weight 500
line 1.10
weight 500
line 1.20
weight 500
line 1.25
weight 500
line 1.30
weight 400
line 1.55
weight 400
line 1.55
weight 400
line 1.40
weight 400
line 1.45
weight 600
line 1.35
05 · Spacing & Shape
節奏與形
基礎單位 4pt，密度越高 margin 越小，場合越正式 margin 越大。
| Scale | Value | Use | |
|---|---|---|---|
| xs | 2-3 pt | 同行內元素 | |
| sm | 4-5 pt | tag padding · 緊湊佈局 | |
| md | 8-10 pt | 元件內部 | |
| lg | 16-20 pt | 元件之間 · 卡片 padding | |
| xl | 24-32 pt | section 標題 margin | |
| 2xl | 40-60 pt | 大 section 之間 | |
| 3xl | 80-120 pt | 長文件章節之間 |
圓角尺度 · Radii
深度 · 陰影三法
Zhi 不用傳統硬陰影，深度交給 ring shadow、whisper shadow 與明暗交替。
Ring Shadow
0 0 0 1pt var(--ring-warm)
按鈕 · 卡片 hover
Whisper Shadow
0 4pt 24pt rgba(0,0,0,0.05)
極輕浮起 · 特色卡
Light ⇌ Dark
parchment ⇌ deep-dark
section 級別 · 對比最明顯
06 · Components
原子元件
元件不求多，只保留能解決具體問題的一組。
Buttons
ring shadow 替代硬投影 · 8pt 圓角
Tags · 三檔
實色 hex · 從弱到強選
Quote
左 2pt 品牌實線 + olive 色
一千個 no 換一個 yes，寧可清淡，不可濃豔。
Metric
襯線數字 · 等寬數位
Section Title
15pt 襯線標題 · 字號建立層級
Dash List
短橫線代替圓點 · 更書卷氣
- 一般文件用暖米紙底；履歷可用純白
- 油墨藍點綴，不引第二色
- Serif 承擔權威
Code Block
象牙白底 · 4pt 圓角 · 等寬字體
// 暖米紙 · 一種克制的溫度 canvas = parchment; accent = ink_blue palette = warm_neutrals − cool_grays document = serif × hierarchy + generous_space beauty = constraints × intention ÷ noise
Featured Card
whisper shadow + 16pt 圓角
Tesla 公司介紹 · One-Pager
中文 A4 · 指標、正文與時間線
07 · Diagrams
內聯圖表
十八種內聯 SVG 圖表涵蓋架構、流程與資料。告訴 Claude 需要哪種圖，即可按 Zhi 的配色與字體嵌入文件。
系統元件與連接關係，一個焦點節點
決策分支，Yes / No 路徑，焦點為成功路徑
季度營收對比，可選顏色漸變或單色
營收結構拆解，支援 3-6 個分段
08 · Decision Lookup
決策速查
遇到「該用什麼」時先看這張表，不在表裡就回到基礎原則。
| 要做什麼 | 怎麼做 |
|---|---|
| 大標題 | serif 500，字號按層級，line-height 1.10-1.30 |
| 正文閱讀 | sans 400，9.5-10 pt，line-height 1.55 |
| 強調一個數字 | color: var(--brand)，不要粗體 |
| 分隔兩段內容 | 2.5pt 品牌色左側豎線，或 0.5pt 暖灰虛線 |
| 引用某人的話 | 左 2pt 品牌色實線 + olive 色 |
| 展示代碼 | ivory 底 + 4pt 圓角 + mono 字體，無邊框 |
| 區分主次按鈕 | Primary 品牌色填充 + ivory 字；Secondary warm-sand + charcoal |
| 標註某張特殊卡片 | border-left: 1.4pt solid var(--brand)，只標一條邊 |
| 章節開始 | serif 500 · 15pt · 純字號層級，無額外裝飾 |
| 文件封面 | 單頁 Display 字號 + 右對齊作者/日期 + 大量留白 |
| 展示關鍵數字 | 基線一行排開，透明不做容器 + serif 大數字（油墨藍） + sans 小標籤 |
09 · Anti-Patterns
反面示例
破例可以，但理由要足夠清楚。
頁面底色
忌避免 #f3f4f6 冷灰。履歷與白底列印版可用純白。
宜始終使用 #f5f4ed parchment，列印時把 @page background 也設為同色，避免白邊。
Tag 著色
忌Tag 用 rgba(27,54,93,0.18)，WeasyPrint 會讓 padding 區與字形區透明度疊加，形成雙層矩形。
宜查 tint 對照表，改用等效實色 #E4ECF5，顏色穩定，PDF 也乾淨。
合成粗體
忌一般文件標題過度合成加粗，會模糊筆畫、削弱層級。
宜保留原字體：正文 400、標題 500；用字號或品牌色左側豎線強調。履歷粗體遵循樣本。
陰影
忌box-shadow 硬投影 0 2px 8px rgba(0,0,0,0.3) 觀感偏硬，印刷時也容易發黑。
宜用 ring shadow (0 0 0 1pt)、whisper (rgba 0.05)，或直接用明暗交替建立層次。
10 · Background
讓內容成為好文件
Zhi 用中文楷體、清晰層級與統一留白，照顧日常文件工作。信件、簡介、研究報告、作品集與簡報，沿用同一套克制的排版規則。
履歷從既有材料出發。完整原稿保留文字，透過排版改善閱讀；零散經歷則透過逐步提問整理。底板、頁數與照片依需求設定，最終交付可編輯檔案與驗證過的 PDF。
11 · 常見問題
FAQ
- Zhi 是什麼？
- 一個面向 AI agent 的文件設計系統。一種強調色、襯線層級、暖色羊皮紙畫布。給任何 LLM agent 一段描述，就能得到穩定的排版輸出。也可以作為視覺設計簡報給到 Claude Design 或 GPT Canvas 這類圖像渲染工具。
- 能生成什麼？
- 八種文件範本：一頁紙、長文件、信件、作品集、履歷、簡報、個股研報、更新日誌，外加一套落地頁系統。履歷會先路由到潤色、從零建構或依據材料重建，再經過視覺引導、動態排版與原文保護，交付 HTML、PDF 與驗證過頁數的可編輯 DOCX。另有 18 種內聯 SVG 圖表。 履歷預設純白、A4 一頁，可選暖米白或兩頁，照片依需求提供。
- 怎麼安裝？
- 目前為私有內測，尚未正式發行。取得儲存庫存取權後，先複製程式碼，再從本機外掛市場安裝。Claude Desktop 使用儲存庫內的 zhi.zip；獲授權的內測使用者在本機建立 zhi-fonts-full.zip，並透過 bash scripts/ensure-fonts.sh --bundle 安裝。
- 支援哪些語言？
- 英文、中文、日文、韓文。拉丁文字用 Charter；中文正文用方正公文楷體，中文履歷姓名用方正新楷體；日文用 YuMincho；韓文用 Source Han Serif K。日文與韓文為最佳努力的 CJK 路徑，交付前會做視覺 QA。