精選 · 開放 · 免費
Koox
以產品為先的純淨有機果汁電子商務，採用大膽字體與內斂自然的色調。
ConsumerProductCleanPhotographic
01
設計氣質 DNA
有機新鮮純淨果汁高級
現代匠心果汁實驗室結合簡潔電子商務
02
色彩
#D25A24Accent
#232323Ink
#727272Ink soft
#FFFFFFBG
#F5F5F5BG soft
#EFEFEFBG quiet
#CCCCCCMuted
rgba(0,0,0,0.12)Line
高對比簡約風格，搭配溫暖、大地色系的強調色。
03
字型
geometric-sans · grotesque-sans
- display
56px · 900 - headline
30px · 700 - body
16px · 400
主要行動號召與區塊標題使用粗體、大寫字母。 · 顯示文字保持較緊湊的行高，以維持視覺衝擊力。
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
以 4px 為基準單位，透過不同的垂直間距建立清晰的層次結構。
05
表面 (圓角 / 陰影 / 邊線)
sm · 1px
md · 4px
lg · 0px
pill · 0px
銳利的 1px 實線邊框，用於結構定義。
rgb(107, 18, 41) 5px 5px 0px 0px · rgba(0, 0, 0, 0.2) 0px 6px 27px 0px
06
版面
1200container
12columns
24pxgutter
768 / 1024breakpoints
內容置中，包含一個全寬英雄區，下方則為三張產品卡片的網格。
07
動效與互動
100msmicro
200mssmall
300msmedium
cubic-bezier(0, 0, 0.3, 1)easing
互動元素採用流暢的淡入淡出與變形轉場效果。
按鈕與連結懸停時，有細微的透明度或變形變化。 · 點擊時立即回應，並微調陰影效果。
08
組件
- button 實心背景區塊搭配大寫文字，無邊框半徑，並帶有細微的偏移陰影。
- card 全幅出血圖片，中央疊加粗體白色文字。
- chip 不適用
- input 不適用
- hero 全視野背景圖片，中央疊加白色文字與顯眼的行動號召按鈕。
09
文案語氣與禁用清單
- 語氣 自信、簡潔、直率。
- 標題風格 粗體、大寫、強調效益導向。
- 按鈕文案 直接、行動導向，採用全大寫設定。
- 不要使用裝飾性或手寫字體——截圖顯示為粗體、簡潔的幾何無襯線字體。
- 不要使用圓角或柔和形狀——截圖顯示為銳利的 1px 邊框且無邊框半徑。
- 不要使用複雜的多色調色盤——截圖顯示為白色、黑色、灰色與一個溫暖強調色的內斂色調。
- 不要將內文置中對齊——截圖顯示顯示文字置中，但產品佈局為結構化編排。
- 不要使用深色模式或陰沉背景——截圖顯示為明亮、以白色為基礎的背景搭配高對比墨色。
- 不要使用繁複的花紋或紋理——截圖顯示為簡潔攝影與實色區塊。
- 避免: 避免使用過度裝飾或手寫風格字體。
- 避免: 避免使用複雜的漸層或陰影效果。
- 避免: 避免使用過多元素競爭的雜亂版面配置。
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
Koox 是一個現代、以產品為先的有機果汁與淨化產品電子商務網站。其特色為簡潔、極簡美學，採用白色、黑色與溫暖赤陶色強調色（#D25A24）的高對比色調。字體粗體且具幾何感，使用大寫字母以增強效果。關鍵色彩代碼為 #FFFFFF（背景）、#232323（墨色）、#D25A24（強調色）與 #113722（深綠品牌色）。重要禁忌：不要使用裝飾字體、不要使用圓角、不要使用深色模式、不要使用繁複花紋、不要使用複雜色彩調色盤、不要使用低對比文字。版面配置寬敞且置中，強調產品攝影。
en · zh-CN · zh-TW · ja · ko