精選 · 開放 · 免費
Bellroy
為現代旅行者設計的優質携行用品，融合實用性與低調風格。
accessoriesecommerce
01
設計氣質 DNA
冒險功能性永續性優質携行
優質戶外品牌結合極簡日本工程
02
色彩
#cd4c20Accent
#333333Ink
#666666Ink soft
#f7f7f7BG
#ffffffBG soft
#efefefBG quiet
#999999Muted
rgba(0,0,0,0.08)Line
乾淨、淺色的背景，搭配強烈攝影，並以單一焦橙色作為關鍵動作的強調色。
03
字型
display-sans · humanist-sans · monospace
- display
64px · 900 - heading
32px · 700 - body
16px · 400 - small
13px · 400
04
間距
3px
7px
14px
21px
28px
42px
56px
84px
以 3.5px 為基本單位，向上調整以處理版面配置與元件間距
05
表面 (圓角 / 陰影 / 邊線)
sm · 5px
md · 10px
lg · 14px
pill · 9999px
使用低透明度黑色或主題灰色的細微 1px 邊框。
card: None · elevated: None
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
標準的 12 欄格線，包含最大寬度容器與一致的溝槽間距。
07
動效與互動
150msmicro
200mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
懸停與聚焦時的色彩與背景平滑過渡 · 互動元素的細微透明度與變形變化
細微的色彩變化或背景過渡 · 透過標準瀏覽器互動提供即時視覺回饋
08
組件
- button 實心填充按鈕，具有膠囊圓角與大寫文字
- card 以影像為主的卡片，具有圓角與細微陰影
- chip 用於類別的小型圓角標籤
- input 乾淨的搜尋欄，帶有佔位文字與搜尋圖示
- hero 全寬生活方式攝影，搭配粗體覆蓋字型與主要動作按鈕
09
文案語氣與禁用清單
- 語氣 自信、有能力且以目的為導向
- 標題風格 簡短、有力、全大寫的陳述，強調實用性與移動
- 按鈕文案 以動作為導向、大寫且直接
- 避免使用明亮霓虹或高飽和度色調 — 網站依賴柔和的自然色調，搭配單一焦橙色。
- 避免使用高度裝飾性或手寫字型 — 設計採用粗體展示無襯線體搭配乾淨的人文無襯線體。
- 避免在版面上堆砌過多 UI 元素或邊框 — 網站保持乾淨、寬敞且以影像為焦點的美學。
- 避免在互動元素上使用銳利的方形角隅 — UI 一致採用圓角，通常達到膠囊圓角半徑。
- 避免使用深色模式或沉重背景 — 網站主要採用淺色中性背景，如 #f7f7f7 和 #ffffff。
- 避免使用具侵略性的陰影或厚重斜角 — 陰影細微，主要用於將卡片微微抬離背景。
- 避免: 繁瑣或過度裝飾的語言
- 避免: 具侵略性或過度推銷的文案
- 避免: 模糊或抽象的聲明
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
Bellroy 是一個優質配件與携行品牌。其設計語言乾淨、自信且以產品為焦點，以淺色中性色調 (#f7f7f7, #ffffff) 與單一焦橙色 (#cd4c20) 為特色。字型採用粗體、窄版的展示無襯線體作為標題，以及乾淨的人文無襯線體作為內文。版面配置寬敞，大量依賴高品質生活方式攝影與充足留白。關鍵避免事項包括：避免霓虹色、裝飾性手寫體、雜亂的 UI、銳利角隅、深色背景以及沉重陰影。聲音是有能力且以動作為導向，強調移動與聰明實用性。
en · zh-CN · zh-TW · ja · ko