精選 · 開放 · 免費

Typelist Upstatement

一個乾淨、富有表現力的編輯展示，用於創意排版。

01

設計氣質 DNA

一個精選的、富有表現力的展示字型圖書館。

02

色彩

極簡、高對比的單色基調，僅被鮮豔、扁平的幾何點綴所打斷。

03

字型

humanist-sans

• display22px · 500
• body16px · 400
• caption12px · 400

大寫轉換一致用於標籤與導覽 · 慷慨使用字距調整以營造通風的編輯感 · 襯線字體謹慎使用於特定風格強調

04

間距

開闊而通風，高度依賴大而有意的留白來框住大膽的視覺元素。

05

表面 (圓角 / 陰影 / 邊線)

06

版面

一個高度不對稱、畫廊般的佈局，優先考慮視覺衝擊力而非密集的資訊網格。

07

動效與互動

互動元素上平滑、審慎的過渡 · 避免突兀動作的優雅緩動曲線

細膩的視覺狀態變化，可能涉及色彩或輕微的空間移動。 · 直接導覽或狀態改變，無激進的視覺回饋。

08

組件

• button 極簡、純粹的排版連結，無明確邊框或背景形狀。
• card 大膽、扁平的幾何形狀（如大圓形）作為主要互動單元。
• hero 一個引人注目的極簡構圖，結合寬廣留白與激進的扁平幾何色帶。

09

文案語氣與禁用清單

• 語氣 自信、精選且專業，專注於視覺衝擊力。
• 標題風格 大寫、緊密追蹤，且常幾何地整合於設計中。
• 按鈕文案 低調且純粹的排版，依賴整體視覺節奏。

• 不要使用通用的 UI 元件，如標準按鈕或卡片——截圖顯示的是扁平的自訂幾何形狀和簡單的排版連結。
• 不要套用複雜的陰影或漸層——截圖顯示的是扁平的實色區域與極簡的留白。
• 不要使用密集、雜亂的佈局——截圖顯示的是寬廣、有意的留白框住極簡內容。
• 不要使用隨意或過度俏皮的排版——截圖顯示的是高度結構化的大寫追蹤與幾何排列。
• 不要使用深色模式或柔和、低對比的調色板——截圖顯示的是極簡的白色背景搭配高對比黑色文字與鮮豔色彩。
• 不要依賴傳統的 UI 邊框進行區隔——截圖顯示的是空間對比與扁平色塊作為主要的視覺分隔器。
• 避免: 避免通用或過度裝飾的 UI 模式
• 避免: 避免雜亂的資訊層級
• 避免: 避免使用漸層或複雜陰影
• 避免: 避免非正式或過度俏皮的排版處理
• 避免: 避免深色模式介面
• 避免: 避免密集的傳統網格佈局

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko