精選 · 開放 · 免費
Article
一個專注於現代家具與居家佈置的簡潔攝影電商平台。
furnitureecommerce
01
設計氣質 DNA
家具現代生活風格直面消費者
現代生活的策展型目錄
02
色彩
#FF6458Accent
#2E2E2EInk
#424242Ink soft
#FFFFFFBG
#F2F2F2BG soft
#626262Muted
rgba(46, 46, 46, 1)Line
以高對比中性色為基底，搭配攝影色彩與活潑的珊瑚色強調。
03
字型
geometric-sans
- display
48px · 700 - h1
32px · 700 - body
16px · 400 - small
14px · 400
按鈕與導覽連結採用大寫字母 · 標題使用緊湊字距與粗體字重 · 內文採用常規字重，搭配舒適行高
04
間距
4px
8px
12px
16px
24px
32px
40px
48px
64px
96px
統一 4px 柵格，各區塊間保留充足間距。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 50px
pill · 9999px
1px solid #2E2E2E
rgba(0, 0, 0, 0.08) 0px 4px 8px 0px · rgba(0, 0, 0, 0.04) 0px 16px 16px 0px · rgba(0, 0, 0, 0.3) 0px 32px 68px 0px
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
全幅主視覺影像，接著是結構化的商品柵格。
07
動效與互動
100msmicro
300mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
hover 時背景顏色平滑過渡 · 介面狀態微調時採用透明度淡變
細微色彩變化或底線顯現 · 即時視覺回饋，常透過色彩轉換實現
08
組件
- button 膠囊造型，純白背景搭配黑色邊框，文字採大寫。
- card 簡潔圖片卡片，下方搭配極簡文字，常以水平滾動或柵格呈現。
- chip 簡約文字型分類連結。
- input 極簡搜尋欄，含佔位文字與放大鏡圖示。
- hero 全出血生活風格攝影，中央疊加文字。
09
文案語氣與禁用清單
- 語氣 實用、啟發性且直接
- 標題風格 簡潔有力且強調效益
- 按鈕文案 清晰、祈使句型並採大寫
- 勿使用圓角矩形——截圖顯示按鈕採用膠囊造型。
- 勿使用過於鮮豔、衝突的強調色系——截圖顯示以克制的中性色為基底，僅單一珊瑚色點綴。
- 勿在卡片上使用複雜陰影——截圖顯示採用極簡、平實的攝影風格。
- 勿使用襯線字體——截圖顯示全數採用無襯線字體。
- 勿使用密集文字區塊——截圖顯示保留充足留白與簡短文案。
- 勿在主要版面使用深色背景——截圖顯示以白色與灰白色背景為主。
- 避免: 過度技術性術語
- 避免: 強勢推銷用語
- 避免: 冗詞贅字
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這是家具品牌的現代電商設計，側重大型生活風格攝影與簡潔字體。版面採用白色背景搭配深灰文字 (#2E2E2E) 與活潑的珊瑚色強調 (#FF6458)。字體屬於幾何無襯線類別，標題使用粗體字重，內文則採用常規字重。關鍵限制：避免使用襯線字體，絕不以圓角矩形作為按鈕造型，並避免會干擾攝影為主版面的密集文字區塊。設計以留白與清晰視覺層級為優先，讓商品影像成為焦點。
en · zh-CN · zh-TW · ja · ko