精選 · 開放 · 免費

Reboot Studio

為軟體新創打造行銷網站的高端代理商作品集。

01

設計氣質 DNA

為軟體創辦人打造的高端訂製工作室。

02

色彩

嚴格的單色調色板，搭配強烈的字體對比。

03

字型

humanist-sans

• display40px · 500
• body16px · 500
• caption14px · 500

使用 Inter 或類似的人文無襯線字體 · 對大型展示標題施加緊湊的負字距 · 主要文字元素維持嚴格的 500 字重

04

間距

寬裕的垂直間距，搭配大型 padding 區塊（觀察到頂部 padding 為 128px）。

05

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

實心 1px 邊框，使用 rgba(0, 0, 0, 0.1) 或 rgb(229, 231, 235)。

0px 1px 1px -0.5px rgba(0,0,0,0.06) · 0px 10px 15px -3px rgba(0,0,0,0.1) · 0px 0px 0px 1px rgba(0,0,0,0.05)

06

版面

置中內容區塊，具有最大寬度，周圍環繞大量留白。

07

動效與互動

文字區塊的平滑淡入與過渡 · 互動元素的細微縮放或顏色變化

互動元素的細微透明度或顏色變化。 · 即時的視覺回應與平滑過渡。

08

組件

• button 藥丸形按鈕，背景為深色 (#232323) 或透明配以細微邊框。
• card 在提供的檢視中未顯著呈現。
• chip 小型藥丸形標籤（例如「Hiring · Web Designer」），帶有 1px 邊框與圓角。
• input 在提供的檢視中未顯著呈現。
• hero 大型字體排版佈局，混合深色與柔和灰色文字，置中於白色背景上。

09

文案語氣與禁用清單

• 語氣 自信、專業且直接。
• 標題風格 直接且具宣示性的陳述。
• 按鈕文案 簡潔且以行動為導向（例如「查看作品」）。

• 不要使用多種強調色——截圖顯示嚴格的黑、白、灰色調。
• 不要使用裝飾性襯線字體——截圖顯示一致使用人文無襯線字體。
• 不要建立擁擠的佈局——截圖顯示寬廣的留白與置中的內容欄位。
• 不要使用厚重的背景紋理——截圖顯示純色白色背景。
• 不要在所有元素上使用複雜的陰影——截圖顯示極簡、細膩的陰影。
• 不要使用全大寫的內文——截圖顯示標準的句子大小寫。
• 避免: 過度複雜的術語
• 避免: 侵略性的銷售語言
• 避免: 不必要的裝飾元素

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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