精選 · 開放 · 免費
Emil Kowalski
一個以簡潔、排版優先的開發者作品集，風格沉穩。
portfoliodev
01
設計氣質 DNA
設計工程師簡潔極簡開發者作品集
一本井然有序的筆記本
02
色彩
#21201cInk
#63635eInk soft
#fdfdfcBG
rgba(233,233,231,1)Line
單色調為主，搭配溫潤的米白色基底與高對比度的排版。
03
字型
humanist-sans
內文使用淺灰色（#63635e），閱讀體驗更柔和。 · 章節標題為黑色（#21201c），字重稍粗。 · 內文保持一致的 24px 行高。
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
垂直節奏由一致的 24px 行高和主要區塊間寬裕的 96px 垂直間距所建立。
05
表面 (圓角 / 陰影 / 邊線)
sm · 0px
md · 6px
lg · 0px
pill · 9999px
1px 實線邊框顏色（rgb(233,233,231)）
0 0 0 1px rgba(0,0,0,0.08) · 0 2px 2px 0 rgba(0,0,0,0.04)
06
版面
640container
1columns
768breakpoints
單欄佈局，採用狹窄且置中的容器。
07
動效與互動
150msmicro
150mssmall
150msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
互動元素上的細微顏色過渡。
滑鼠懸停時的細微顏色變化（transition: 0.15s）。 · 標準點擊行為。
08
組件
- button 深色、藥丸形的主要操作按鈕，搭配白色文字。
- card 不適用 - 極簡的列表式結構，無卡片設計。
- chip 不適用
- input 圓角輸入框，帶有細微邊框。
- hero 極簡的文字型首頁區域，包含姓名、職稱與簡介。
09
文案語氣與禁用清單
- 語氣 自信、專業且直接。
- 標題風格 簡潔有力，通常為單詞或短語。
- 按鈕文案 簡單、以行動為導向的文字，搭配高對比度按鈕。
- 勿使用鮮豔飽和的強調色 — 截圖顯示為單色調色板。
- 勿使用複雜的多欄佈局 — 截圖顯示為單一窄欄。
- 勿使用厚重的陰影效果 — 截圖顯示為極簡、細微的邊框。
- 勿使用巨大、戲劇化的字體 — 截圖顯示為適中、易讀的字號。
- 勿使用純粹幾何或人文特質的無襯線字體 — 截圖顯示為簡潔、中性的無襯線體。
- 勿使用過多的內邊距或外邊距 — 截圖顯示為緊湊、一致的間距。
- 避免: 行銷話術
- 避免: 複雜術語
- 避免: 過多的驚嘆號
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這是一個為設計工程師打造的極簡主義開發者作品集。設計依賴簡潔的單色調色板，搭配溫潤的米白色背景（#fdfdfc）和深墨色（#21201c）。佈局為單一、狹窄的欄位，優先考慮可讀性與內容，而非視覺複雜度。字體採用中性的無襯線字體類別，透過字重與顏色而非尺寸來建立清晰的層級結構。關鍵設計元素包括細微的 1px 邊框和圓角輸入框。重要禁忌：避免使用鮮豔的強調色、複雜的網格佈局、厚重的陰影效果，以及過大的展示型字體。整體感覺沉穩、精緻且專業。
en · zh-CN · zh-TW · ja · ko