精選 · 開放 · 免費
Louis Poulsen
一個擁有簡潔、編輯式且聚焦畫廊視覺語言的高級燈具品牌。
lightingdesign
01
設計氣質 DNA
設計燈具高級建築風格
一個高端工業設計的編輯式畫廊
02
色彩
#000000Ink
#333333Ink soft
#FFFFFFBG
#F6F6F6BG soft
#808080Muted
rgba(0,0,0,0.25)Line
高對比的單色調色板,讓豐富的攝影和留白主導畫面。
03
字型
transitional-serif · humanist-sans
- display
56px · 300 - headline
30px · 300 - body
14px · 400
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
以 4px 為基礎的網格,搭配舒適、充足的留白,營造編輯式感受。
05
表面 (圓角 / 陰影 / 邊線)
sm · 2px
md · 4px
lg · 40px
pill · 999px
使用 1px solid rgba(0,0,0,0.25) 作為分隔線;互動式列表項目大量使用邊框。
06
版面
1440container
12columns
24pxgutter
768 / 1024breakpoints
不對稱的編輯式佈局,包含大型主視覺圖片、多欄位的瀑布流風格照片網格,以及全寬度的列表區域。
07
動效與互動
150msmicro
200mssmall
350msmedium
ease-in-outeasing
連結和列表項目上的流暢 hover 轉換,互動元素上細微的縮放變換。
細微的背景或文字顏色變化;分類列表項目上的啟用狀態指示。 · 乾淨的狀態變換,最小的視覺回饋以維持優雅感。
08
組件
- button 低調、以文字為主的按鈕,裝飾極少;顯眼的黑色填充「查看更多」操作按鈕。
- card 邊到邊的攝影,採用密集的網格佈局,沒有可見的內距或背景。
- hero 全視窗的電影感圖片,配以大型、優雅的襯線文字覆蓋層和精簡的輔助文案。
09
文案語氣與禁用清單
- 語氣 自信、高級且引人遐思,聚焦於燈具設計的工藝與歷史。
- 標題風格 優雅、全大寫的襯線字體,字距緊湊。
- 按鈕文案 極簡主義,常使用簡單的箭頭或大寫的無襯線文字。
- 不要使用圓角 — 截圖顯示所有 UI 元件都有銳利的 90 度邊角。
- 不要使用陰影 — 截圖顯示平面的表面依賴邊框和攝影來呈現深度。
- 不要使用明亮的強調色 — 截圖顯示嚴格的單色調色板,包含黑、白和灰。
- 不要使用粗體字重 — 截圖顯示主要使用 regular (400) 和 light (300) 字重。
- 不要使用雜亂的導覽列 — 截圖顯示一個極簡的頂部導覽欄,具有充足的水平間距。
- 不要使用厚重的容器內距 — 截圖顯示的佈局允許攝影和文字靠近視窗邊緣。
- 避免: 擁擠的佈局
- 避免: 鮮豔或具侵略性的顏色
- 避免: 俏皮或過於隨意的語言
10
包內真實截圖
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這個網站是一個高端燈具品牌的高級編輯式電商體驗。設計極度依賴電影感的攝影、充足的留白,以及嚴格的單色調色板,包含白色 (#FFFFFF)、黑色 (#000000) 和中性灰 (#F6F6F6)。字體方面,展示標題使用精緻的過渡襯線體,內文和導覽則使用乾淨的人文無襯線體。關鍵的禁止事項包括:絕不使用陰影或卡片上的圓角,絕不引入高飽和度的強調色,也絕不使用粗體字重以破壞優雅、通透的感受。確保所有互動都使用流暢的 ease-in-out 轉換,以維持其高級的美學。
en · zh-CN · zh-TW · ja · ko