精選 · 開放 · 免費
Friendsofthenew
為新興藝術家打造的單色調編輯風格展示，具備巨型字體存在感與攝影拼貼佈局。
EditorialPhotographicStudioPortfolioTypography
01
設計氣質 DNA
編輯風格策展風格攝影風格極簡主義前衛
一本高端時尚的藝術畫廊雜誌
02
色彩
#000000Ink
#f4f4efBG
rgba(0,0,0,1.0)Line
嚴格的單色調色盤，依賴純黑與溫暖的米白色以達到最大對比度與編輯優雅感。
03
字型
transitional-serif · humanist-sans
- display
200px · 400 - body
10px · 400
標誌字體使用高對比度的過渡襯線體以創造戲劇性視覺衝擊 · 使用者介面元件使用簡潔的人文無襯線體以確保小尺寸下的可讀性 · 大型展示文字使用緊湊的字距調整以保持整體感
04
間距
4px
8px
16px
20px
24px
32px
48px
64px
96px
基於格狀系統，搭配 20px 的間距與充裕的留白，以營造編輯節奏。
05
表面 (圓角 / 陰影 / 邊線)
sm · 0px
md · 0px
lg · 0px
pill · 999px
1px solid rgb(0, 0, 0)
06
版面
1440container
12columns
20pxgutter
768 / 1024breakpoints
底部固定的標誌字體，上方為浮動、拼貼風格的圖片格狀佈局
07
動效與互動
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing
懸停時的平滑圖片濾鏡過渡 (0.3s ease-out) · 一般元件的狀態變化過渡
圖片濾鏡或輕微的視覺位移 · 直接導覽，無彈窗干擾
08
組件
- button 極簡的文字連結，帶有圓形外框指示器
- card 無邊框的攝影圖片，浮動於寬鬆的格狀佈局中
- chip 圓形指示點，用於導覽狀態
- input 極簡的文字型導覽，無可見的輸入欄位
- hero 全寬的展示用標誌字體，錨定於視窗底部
09
文案語氣與禁用清單
- 語氣 精緻、含蓄且自信
- 標題風格 巨型、無所畏懼的字體排印聲明
- 按鈕文案 含蓄、基於文字的導覽，無傳統按鈕樣式
- 請勿使用鮮豔的強調色——截圖僅顯示純黑與溫暖的米白色
- 請勿使用圓角——截圖僅顯示銳利的邊緣與圓形藥丸狀
- 請勿將文字置中對齊——截圖顯示左對齊的導覽與底部錨定的標誌字體
- 請勿使用陰影——截圖顯示完全平面的攝影圖層
- 請勿使用無襯線體作為展示文字——截圖顯示主要標誌字體使用過渡襯線體
- 請勿添加裝飾性邊框或框架——截圖顯示無框架、浮動的攝影元素
- 避免: 鮮豔色彩
- 避免: 圓角
- 避免: 陰影
- 避免: 裝飾性圖示
- 避免: 繁雜圖案
- 避免: 置中對齊的文字
- 避免: 無襯線體標題
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
此網站為一個藝術家團體的極簡主義、編輯風格作品集，以單色調色盤與巨型字體為特徵。設計依賴溫暖米白色背景與黑色墨水之間的強烈對比，使用過渡襯線體作為主要標誌字體，並以人文無襯線體作為小型使用者介面文字。關鍵限制在於避免使用色彩、圓角與陰影，強調平面化的攝影拼貼美學。佈局採用底部固定的標誌字體，上方浮動圖片，營造出類似畫廊的體驗。請避免任何鮮豔的色彩或裝飾元素，專注於字體排印、攝影與充裕的留白。
en · zh-CN · zh-TW · ja · ko