精選 · 開放 · 免費
Bond
一個大膽、充滿活力的創意代理網站，運用超大尺寸的排版字體與鮮明的珊瑚色點綴，創造出醒目且表現力強烈的展示平台。
BrandStudio
01
設計氣質 DNA
創意代理高能量大膽趣味作品集
一個大膽、充滿活力的創意工作室，運用表現力強烈的排版與鮮明色彩來吸引目光。
02
色彩
#FF5D60Accent
#000000Ink
#333333Ink soft
#FFFFFFBG
#555555Muted
rgba(0, 0, 0, 1)Line
高對比度，搭配鮮明的珊瑚色點綴與攝影風格背景。
03
字型
grotesque-sans
- display
123px · 700 - heading
70px · 700 - body
18px · 700 - small
12px · 400
大多數文字元素使用粗體（700）。 · 標題文字使用緊湊的行高。 · 導航與標籤使用大寫字母。
04
間距
4px
8px
16px
24px
32px
48px
64px
75px
96px
大型排版文字周圍採用寬鬆的內距，介面元素則使用緊湊的間距。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
1px solid #000000
0 0 10px 0 rgba(0, 0, 0, 0.12) · 0 0 20px 0 rgba(0, 0, 0, 0.1)
06
版面
1440container
12columns
24pxgutter
768 / 1024breakpoints
全版圖片主視覺，接著是大型排版文字區塊。
07
動效與互動
220msmicro
400mssmall
800msmedium
cubic-bezier(0.77, 0, 0.175, 1)easing
懸停狀態與選單互動採用流暢的過渡效果。 · 排版文字採用視差或滾動觸發的動畫。
按鈕的顏色反轉或背景色變化。 · 細微的縮放或透明度變化。
08
組件
- button 藥丸形按鈕，採用珊瑚色背景搭配白色文字，或白色背景搭配黑色文字與黑色邊框。
- card 極簡卡片，搭配大型排版文字與攝影元素。
- chip 藥丸形標籤或標示。
- input 極簡表單輸入框，帶有黑色邊框。
- hero 全螢幕攝影風格主視覺，搭配疊加文字或極簡標頭。
09
文案語氣與禁用清單
- 語氣 自信、直接，並帶有一絲趣味。
- 標題風格 超大尺寸、粗體，且常使用小寫或句首大寫。
- 按鈕文案 以行動為導向，並搭配箭頭圖示。
- 不要使用細微或低調的排版風格——截圖顯示的是超大、粗體的標題。
- 不要使用柔和或粉彩色調的色板——截圖顯示的是鮮明的珊瑚色點綴（#FF5D60）與高對比的黑白配色。
- 不要使用缺乏大型排版文字的複雜網格——截圖顯示的是寬敞的留白與超大的文字。
- 不要使用襯線字體作為標題——截圖顯示的是粗體的怪誕無襯線字體。
- 不要使用密集的小段文字——截圖顯示的是簡短、有力的文案搭配較大的行高。
- 大多數元素不要使用圓角——截圖顯示的是銳利的邊角或藥丸形按鈕。
- 避免: 細微或低調的排版風格。
- 避免: 柔和或粉彩色調的色板。
- 避免: 缺乏大型排版文字的複雜網格或版面。
- 避免: 缺乏清晰、具表現力主體的圖庫攝影。
- 避免: 用於標題的襯線字體。
- 避免: 密集的小段文字。
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這是一個大膽、充滿活力的創意代理網站。使用鮮明的珊瑚色點綴（#FF5D60）搭配鮮明的黑白配色。排版字體是主要設計驅動力，採用粗體怪誕無襯線字體作為超大標題與內文。版面採用寬敞的留白，專注於大型排版文字與攝影元素。避免細微或低調的設計選擇、柔和的色彩，以及缺乏大型排版文字的複雜網格。確保所有互動元素具有流暢、可見的過渡效果，以及自信、直接的語氣。
en · zh-CN · zh-TW · ja · ko