精選 · 開放 · 免費

SSENSE

一個融合社論式敘事與簡潔、以字型為導向的極簡美學的高端時尚電子商務平台。

01

設計氣質 DNA

一本也販售服裝的高級時尚雜誌，其中攝影主導敘事，而排版則作為靜謐的基礎架構。

02

色彩

嚴謹的單色調色板，運用不同粗細的黑色與灰色，以維持類似畫廊般、專注於攝影的乾淨視覺。

03

字型

transitional-serif

• display66px · 400
• heading20px · 400
• body15px · 400
• caption11px · 400

導覽與功能性連結使用幾何無襯線字型，採用大寫字母與字距調整。 · 所有社論標題與內文使用 JHA Times Now（過渡襯線字型）。 · 大型展示文字需保持極緊的行距。 · 展示與標題排版使用細微的負字距調整。

04

間距

內容區塊周圍有大量內邊距，以維持寬敞、可呼吸的社論感，經常使用 80px 的垂直邊距。

05

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

使用細微的 1px 水平線來分隔區段並界定文章卡片邊界。

06

版面

不對稱的社論式網格，包含大型主視覺影像，後接混合佈局，結合寬幅影像、堆疊的文字區塊與水平列表。

07

動效與互動

互動元素的流暢懸停過渡效果 · 影像懸停時的細微縮放或平移 · 無縫的頁面過渡效果

文字連結出現細微底線或色彩反轉 · 立即導覽，無沉重動畫

08

組件

• button 基於文字的連結，功能性導覽常用大寫無襯線字型，依賴懸停狀態而非填充背景。
• card 無邊框的攝影卡片，字型置於下方；或分割卡片，在頂部或底部帶有 1px 邊框。
• chip 無
• input 無可見元素
• hero 全寬攝影佈局，以帶有緊湊字距的大型自訂字型為主。

09

文案語氣與禁用清單

• 語氣 客觀、冷靜且帶有社論式的抽離感。
• 標題風格 全大寫、字距緊湊的無襯線字型或強烈的過渡襯線字型，以製造衝擊力。
• 按鈕文案 低調的大寫文字連結，帶有寬裕的字距。

• 不要使用投影陰影——此網站依賴平面影像與細微邊框來營造深度感。
• 不要引入明亮的強調色——此網站嚴格執行黑、白、灰的單色調色板。
• 不要使用過度圓潤的角落——此網站在所有佈局元素與影像上維持銳利、方正的邊緣。
• 不要使用過於粗體或醒目的字型——此網站使用精緻的字重（100-400）以營造優雅美學。
• 不要使介面雜亂——此網站使用大量留白來創造高端、類似畫廊的體驗。
• 不要使用裝飾性或俏皮的圖示——介面完全依賴乾淨的排版與高品質攝影。
• 避免: 過度熱情的行銷用語
• 避免: 明亮、高飽和度的色彩
• 避免: 圓潤的 UI 元素或柔和陰影

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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