精選 · 開放 · 免費

Henry Codes

為一位丹佛的網頁開發者與設計師打造的大膽、排版驅動的創意作品集。

01

設計氣質 DNA

一個大膽、實驗性的創意作品集，感覺像是高端時尚編輯與地下獨立雜誌的混合體。

02

色彩

高對比的單色調，具備極致的排版密度，偶爾穿插粗野主義的版面變化。

03

字型

transitional-serif · geometric-sans

• display77px · 400
• body16px · 400

04

間距

嚴格的 4px 基礎單位，搭配寬敞的留白以平衡沉重的排版。

05

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

簡潔的 2px 實心邊框或無邊框；依賴間距與字重來創造層次。

06

版面

全出血的區塊，在淺色與深色背景之間交替。

07

動效與互動

連結與互動元素上細微的懸停轉場效果

細微的顏色或寬度轉場。 · 即時回應，無彈跳或縮放效果。

08

組件

• button 低調的文字連結，具備懸停轉場效果。
• card 極簡、無邊框的容器，依賴排版來建立層級。
• hero 巨大的、超大尺寸的排版文字，佔滿整個視窗寬度。

09

文案語氣與禁用清單

• 語氣 大膽、毫不妥協且高度個人化。
• 標題風格 具侵略性、超大尺寸的襯線體排版，引人注目。
• 按鈕文案 低調、以文字為主的行動呼籲，讓內容本身發聲。

• 不要使用柔和的粉彩色調——截圖顯示的是高對比單色調色板。
• 不要使用俏皮的圓角 UI 元素——截圖顯示的是銳利、粗野主義的排版。
• 不要使用小而密集的網格——截圖顯示的是巨大、全出血的排版佈局。
• 不要使用細微的裝飾性圖片——截圖顯示的是大膽的像素化或抽象藝術。
• 不要使用傳統、安全的佈局——截圖顯示的是實驗性、重疊的文字。
• 不要使用單一背景顏色——截圖在純白與近乎純黑的區塊間交替。
• 避免: 通用的企業語言
• 避免: 柔和或俏皮的設計元素
• 避免: 傳統的網格佈局

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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