精選 · 開放 · 免費

Cowboy

一個為城市電動自行車公司打造的精緻頂級品牌網站，採用單色調色盤與高品質影像。

ProductHardwareCalmRefinedClean
Cowboy 網站截圖
↓ 下載設計系統包 (59 MB)在 OpenDesign 中開啟

原站: https://cowboy.com

📦 瀏覽包內檔案 →

01

設計氣質 DNA

頂級城市出行極簡精緻生活方式

結合工業設計與城市生活攝影的高階歐洲電動自行車品牌。

02

色彩

#1D1D1DInk
#1D1D1D99Ink soft
#FFFFFFBG
#EBEAE7BG soft
#A3A3A3Muted
rgba(229, 231, 235, 1)Line

嚴格的中性調色盤，以近乎黑色與白色為主，運用細微的溫暖灰色作為次要元素與邊框。

03

字型

humanist-sans · monospace

04

間距

4px
8px
16px
24px
32px
48px
64px
96px

以 4px 為基準單位，採用標準增量，主要區塊的內距則使用較大數值（48px、64px）。

05

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

sm · 4px
md · 8px
lg · 8px
pill · 9999px

1px solid rgb(229, 231, 235)，用於輸入框與細微分隔線。

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

06

版面

1280container
12columns
24pxgutter
768 / 1024breakpoints

彈窗遮罩在桌面端呈現 50/50 的圖文分割佈局，在行動端則垂直堆疊。

07

動效與互動

100msmicro
150mssmall
300msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

色彩、背景與邊框變化的流暢過渡 · 微互動採用標準的 Material 風格緩動

互動元素在 hover 時產生細微的色彩或背景過渡。 · 互動狀態可能涉及細微的變形或色彩反轉。

08

組件

09

文案語氣與禁用清單

10

包內真實截圖

Cowboy — 桌面首屏（hero）
桌面首屏（hero）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Cowboy — 移动首屏
移动首屏

擷取自真實頁面 · 真 computed styles

11

System Prompt

這是一個為現代電動自行車公司（Cowboy）打造的頂級、精緻品牌網站。設計 DNA 為極簡且精緻，採用嚴格的中性調色盤，以近乎黑色（#1D1D1D）與白色（#FFFFFF）為主，輔以細微的溫暖灰色作為邊框與次要文字。字體為簡潔的人文無襯線字體（SuisseIntl），搭配大號、緊湊字距的標題。關鍵互動透過膠囊形按鈕與簡潔、內距充足的表單輸入框處理。佈局專注且寬敞，常採居中設計。關鍵禁忌：絕不使用鮮豔的點綴色，絕不使用銳利方正的圓角，絕不使用寬鬆字距或裝飾性字體。

把這份品味接進你的 Agent

把這套設計的機器可讀規格——色彩、字體、動效，整套 DNA——直接交給你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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