精選 · 開放 · 免費
Footer
專注於大膽字型與編輯式呈現的策展設計藝廊。
designgallery
01
設計氣質 DNA
策展編輯式頁尾設計藝廊極簡
一個簡潔、以字型為主的藝廊策展平台
02
色彩
#242424Ink
rgba(36,36,36,0.64)Ink soft
#FFFFFFBG
#F2F2F2BG soft
#737373Muted
rgba(36,36,36,0.12)Line
嚴格單色調，白色留白與深色文字之間具有高對比
03
字型
grotesque-sans · humanist-sans
主要文字使用 18px，字距為 -0.54px · 次要文字使用 14px，字距為 -0.42px · 標題使用 600 字重 · 內文使用 400 字重
04
間距
4px
8px
12px
16px
24px
40px
60px
一致的間距增量：4, 8, 12, 16, 24, 40, 60
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 1600px
pill · 1600px
卡片與按鈕採用 1px solid rgba(36,36,36,0.12) 邊框
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
藝廊卡片採用多欄格狀佈局
07
動效與互動
150msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
懸停時的細微淡入淡出過渡 · 色彩與背景色的平滑變化 · 狀態轉換的透明度過渡
色彩與背景色過渡時間為 0.15 秒 · 標準指標游標
08
組件
- button 藥丸造型，具 1600px 圓角，填色為黑色或白色
- card 以圖片為主，邊框極簡，字型清晰
- chip 小型圓角標籤，用於篩選
- hero 大型字型引言，搭配細微動畫
09
文案語氣與禁用清單
- 語氣 專業、簡潔、經過策展
- 標題風格 粗體、緊湊字距、大寫或大型大小寫
- 按鈕文案 直接、以行動為導向，採用藥丸造型按鈕
- 勿使用鮮豔的強調色——截圖顯示嚴格的單色調色盤
- 除藥丸按鈕外，勿使用圓角——截圖顯示卡片具有銳角
- 勿使用陰影——截圖顯示平面、以邊框定義的表面
- 勿使用裝飾性字型——截圖使用簡潔的 grotesque 與 humanist 無襯線字型
- 勿建立密集的佈局——截圖使用寬裕的留白與清晰的層級
- 勿使用多種字型族——截圖主要依賴 Inter，搭配不同字重
- 避免: 雜亂的介面
- 避免: 過多的裝飾元素
- 避免: 模糊的語言
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
一個極簡的設計策展藝廊，專注於網頁設計作品的編輯式呈現。色調嚴格採用單色調，背景使用 #FFFFFF，軟性背景使用 #F2F2F2，主要墨色使用 #242424，次要文字使用 rgba(36,36,36,0.64)。字型使用 Inter（humanist-sans 用於內文，grotesque-sans 用於展示），字距緊湊。關鍵禁忌：避免鮮豔的強調色，除藥丸按鈕外避免圓角，避免陰影，避免裝飾性字型，避免密集佈局，避免多種字型族。設計強調簡潔的線條、寬裕的間距與清晰的字型層級，以展示策展的設計作品。
en · zh-CN · zh-TW · ja · ko