精選 · 開放 · 免費
Craft
一個高端、沉靜的生產力工作空間，融合了結構性與富有表現力的創造力。
productdocs
01
設計氣質 DNA
優雅深思熟慮高效有條理沉靜
一本為現代思考者設計的精緻數位筆記本。
02
色彩
#030302Ink
#4A4A4AInk soft
#FFFFFFBG
#F5F5F5BG soft
#EBEBEBBG quiet
#E1E1E1Muted
rgba(3,3,2,0.09)Line
在乾淨的背景上使用高對比的墨色以提升可讀性，並在插圖中以柔和色調作為點綴。
03
字型
transitional-serif · geometric-sans
使用襯線體作為展示標題，以傳達優雅與深思熟慮感。 · 使用無襯線體作為所有內文、導航和使用者介面元素，以確保清晰度。 · 展示字體保持緊湊的負字距。
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
充足的留白，營造沉靜、舒適的閱讀體驗。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 14px
lg · 24px
pill · 999px
1px solid rgba(3,3,2,0.09)
0px 20px 40px 0px rgba(0, 0, 0, 0.05) · 0px 3px 10px 0px rgba(0, 0, 0, 0.08)
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
乾淨、置中的垂直佈局，具有強烈的排版層次和寬敞的區塊。
07
動效與互動
150msmicro
200mssmall
500msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
懸停狀態下流暢的色彩與不透明度過渡。
細微的背景色彩偏移或不透明度變化。 · 立即、清晰的反應。
08
組件
- button 膠囊形按鈕，搭配高對比背景（主要行動號召為黑色，次要為白色）。
- card 邊角柔和圓潤的卡片，帶有細微的投影陰影，常將相關內容或任務分組。
- chip 用於狀態或標籤的極簡膠囊，背景為淺柔和色。
- input 乾淨、無邊框或邊框不明顯的輸入框，融入背景表面。
- hero 大型的排版聲明，疊加在富有表現力、帶有質感的拼貼插圖上。
09
文案語氣與禁用清單
- 語氣 具吸引力、深思熟慮且賦予力量。
- 標題風格 清晰、以效益為導向的陳述，使用優雅的襯線字體排版。
- 按鈕文案 直接且具鼓勵性，專注於立即價值（例如：「免費試用 Craft」）。
- 不要為所有事物使用單一強調色——截圖顯示插圖中有多樣的柔和色調。
- 不要使用厚重的投影陰影——截圖顯示細微、柔和的陰影以營造深度。
- 不要為內文使用全大寫——截圖顯示僅在小型分類標籤上使用大寫。
- 不要使用深色模式介面——截圖顯示以明亮、淺色為主的背景。
- 不要使用銳利、方正的邊角——截圖顯示高度圓潤的邊角（最高可達 24px 或膠囊形狀）。
- 不要使用僵硬、網格繁重的佈局——截圖顯示插圖中更 organic、流動的排列。
- 避免: 術語過多或過於技術性的語言。
- 避免: 激進或喧鬧的推廣語氣。
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
此設計代表一款高端、沉靜的生產力工具，融合了有條理的組織與富有表現力的創造力。它採用以墨黑 (#030302) 搭配乾淨白色 (#FFFFFF) 表面為主的高對比配色方案。字體排版將優雅的過渡襯線體用於展示標題，搭配乾淨的幾何無襯線體用於內文和使用者介面。關鍵十六進位色碼包括 #030302、#FFFFFF，以及細微的邊框色 rgba(3,3,2,0.09)。關鍵的禁止事項包括：不要使用激進的投影陰影，不要使用銳利的邊角，不要依賴單一高飽和度的強調色。佈局強調充足的留白和置中的垂直流動，創造一個舒適、專注的使用者體驗。
en · zh-CN · zh-TW · ja · ko