精選 · 開放 · 免費

Postfamiliar

專為獨家葡萄酒俱樂部打造的大膽、高對比暗黑模式編輯設計。

01

設計氣質 DNA

一本帶有粗野主義風格的高端獨家葡萄酒俱樂部雜誌。

02

色彩

嚴謹的高對比單色調，搭配單一鮮豔的粉色強調色。

03

字型

grotesque-sans · monospace

• display230px · 400
• heading70px · 400
• subhead46px · 400
• body16px · 400
• label20px · 400

大量使用大寫文字作為標題和按鈕。 · 大型展示文字採用緊湊的字距調整。

04

間距

透過一致的 padding 和 gap 倍數建立垂直節奏。

05

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

所有互動元素均以高對比的 2px 實心白色或黑色邊框定義。

06

版面

置中、全螢幕的首頁區塊，配有固定寬度的內容欄位。

07

動效與互動

使用 opacity 轉場來揭示元素。 · 使用 transform 轉場來處理 hover 狀態。

反轉顏色或將邊框顏色改為粉色。 · 透過 scale 或 opacity 提供即時視覺回饋。

08

組件

• button 膠囊形狀，透明填充，帶有 2px 實心白色邊框。
• card 方形，具有銳利邊角，由 2px 實心白色邊框定義。
• chip 極簡文字標籤，通常為大寫且字距寬鬆。
• input 膠囊形狀，帶有 2px 實心白色邊框。
• hero 全螢幕、高對比的字體排印首頁區塊，配有巨大的展示文字。

09

文案語氣與禁用清單

• 語氣 權威、獨家且極簡。
• 標題風格 巨大、粗體、大寫無襯線字體。
• 按鈕文案 直接、大寫、膠囊形狀的按鈕。

• 不要使用投影效果 — 螢幕截圖顯示元素由 2px 實心邊框定義。
• 不要使用淺色背景 — 螢幕截圖顯示純 #000000 暗黑模式背景。
• 不要使用小寫標題 — 螢幕截圖顯示巨大的大寫字體排印。
• 不要使用圓角卡片邊角 — 螢幕截圖顯示卡片具有銳利的 90 度角。
• 不要使用柔和、低飽和度的顏色 — 螢幕截圖顯示帶有鮮豔粉色強調色的高對比調色盤。
• 不要所有內容都置中對齊 — 螢幕截圖顯示內文左對齊，導航元素右對齊。
• 避免: 友好或隨意的語言。
• 避免: 圓潤、柔和的形狀。
• 避免: 複雜的漸層或投影效果。
• 避免: 雜亂的版面配置。
• 避免: 內文使用襯線字體。
• 避免: 低飽和度的調色盤。

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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