精選 · 開放 · 免費

Foundation

以字型為核心的真誠關站公告，採用節制的單色調設計。

01

設計氣質 DNA

一封坦率的公開信。

02

色彩

高對比單色調色盤，極簡慎用單一暖色調點綴。

03

字型

humanist-sans

• display56px · 700
• body20px · 400
• caption11px · 400

如日期與頁尾文字等小型標籤採用大寫並加寬字距。 · 顯著的展示標題採用緊湊字距與粗體字重。 · 段落間距寬裕，以維持平靜的閱讀節奏。

04

間距

一致的垂直節奏，搭配寬裕留白以突出文字內容。

05

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

使用半透明白色或淺灰色的細微 1px 邊框。

inset 0 0 2px 0 rgba(0, 0, 0, 0.03)

06

版面

優化閱讀性的窄幅、單欄居中佈局。

07

動效與互動

互動元素的平滑減速過渡。 · 細膩的透明度淡化。

互動元素上的細微背景色變化。 · 作用狀態的平滑過渡。

08

組件

• button 極簡的膠囊型按鈕，帶有細微邊框。
• card 帶邊框的容器，內距極小，用於嵌入社群貼文。
• hero 極簡的全幅首圖區域，僅包含居中的大尺度標題與小型日期。

09

文案語氣與禁用清單

• 語氣 真誠、直接且透明。
• 標題風格 簡短、有力且具宣示性。
• 按鈕文案 細膩不突兀，通常次於主要訊息。

• 避免使用複雜佈局 — 螢幕截圖顯示高度專注的單欄閱讀佈局。
• 避免使用多種鮮豔色彩 — 螢幕截圖顯示嚴格的單色調色盤搭配單一強調色。
• 避免使用襯線字體或高度裝飾性字體 — 螢幕截圖顯示簡潔中性的人文無襯線字體。
• 避免使用密集擁擠的間距 — 螢幕截圖顯示段落間寬裕的留白。
• 避免使用粗重邊框或陰影 — 螢幕截圖顯示僅有極細微的半透明邊框。
• 避免將所有內文置中 — 螢幕截圖顯示內文在置中容器內採左對齊。
• 避免: 行銷術語
• 避免: 過度明亮或飽和的色彩
• 避免: 密集複雜的佈局

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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