精選 · 開放 · 免費
Nathansmith
極簡的單色調作品集網站,運用極致字體比例與廣闊負空間,創造如畫廊般的奢華展示。
PortfolioTypographyBoldCurationStudio
01
設計氣質 DNA
極簡奢華藝術指導大膽編輯風格
高端單色調藝術畫廊。
02
色彩
#F5F4EEInk
#FFFFFFInk soft
#000000BG
#333333Muted
rgba(245, 244, 238, 1)Line
極致單色極簡主義,依賴字體與負空間。
03
字型
transitional-serif · geometric-sans
- display
80px · 400 - body
16px · 400 - caption
14px · 400
標題文字使用過渡襯線體 · 內文使用幾何無襯線體 · 所有標題元素的大寫字體排印
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
128px
寬敞的垂直與水平間距,帶有大間隙
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
無可見邊框,依賴負空間
None: None
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
不對稱、邊緣固定,帶有廣闊中央負空間
07
動效與互動
220msmicro
500mssmall
1000msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
淡入 · 色彩轉換 · 透明度變化
所有互動元素上顯示游標指標 · 立即的視覺回饋
08
組件
- button 深色背景、淺色文字的膠囊形按鈕
- card 帶有深色陰影的極簡浮動卡片,用於獎項
- chip 膠囊形標籤
- hero 廣闊的空白空間,邊緣固定單一巨大的字體元素
09
文案語氣與禁用清單
- 語氣 沉穩、自信、專業
- 標題風格 粗體、全大寫、巨大比例
- 按鈕文案 極簡、基於文字並帶有箭頭指示
- 不要使用多種色彩——截圖顯示嚴格的黑、白、灰單色調色盤
- 不要置中對齊文字——截圖顯示靠左對齊、邊緣固定的字體排印
- 不要使用緊湊的間距——截圖顯示元素之間廣闊的空白負空間
- 不要使用狹小、擁擠的版面配置——截圖顯示如畫廊般的極簡構圖
- 不要使用複雜的背景——截圖顯示純色、平坦的黑色背景
- 不要使用裝飾性邊框——截圖顯示元素以空間分隔,而非線條
- 避免: 裝飾元素
- 避免: 雜亂的版面配置
- 避免: 鮮豔色彩
10
包內真實截圖
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
藝術指導的極簡作品集網站。設計採用嚴格的單色調,使用黑色背景(#000000)與灰白文字(#F5F4EE),搭配過渡襯線標題字體與幾何無襯線內文字體。特色在於標題的龐大字體比例與廣闊的空白負空間,營造如畫廊般的奢華感。浮動介面元素使用深色陰影與膠囊形狀。關鍵限制:保持嚴格的單色調色盤、使用龐大的負空間,並將所有字體排印固定於視口邊緣。
en · zh-CN · zh-TW · ja · ko