精選 · 開放 · 免費
Misuko Be
健康飲品配方與生產的 B2B 服務提供者。
StudioProductCurationCleanWarm
01
設計氣質 DNA
包裝飲料服務製造簡潔
專為飲料品牌打造的簡潔專業包裝工作室
02
色彩
#000000Ink
#6A6965Ink soft
#F2EFE3BG
#FCF9EEBG soft
#BCBEB2Muted
rgba(188,186,178,1)Line
柔和、沉穩的大地色背景，搭配高對比的黑色字體排印。
03
字型
grotesque-sans
- display
48px · 500 - heading
34px · 400 - body
14px · 400
標題使用緊湊的負字距 · 內文維持舒適的 1.36 行高 · 導覽連結與內文共用相同基礎字級
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
區塊內寬裕的內邊距（例如上下各 116px）創造出有節奏感、呼吸感的版面配置。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 20px
pill · 999px
按鈕與結構分隔線使用細緻的 1px 邊框，顏色為柔和色調（#BCBEB2）或實色黑（#000000）。
rgba(0,0,0,0.15) 0px 0px 8px 3px
06
版面
1440container
12columns
24pxgutter
768 / 1024breakpoints
以分割畫面視覺區塊開始，過渡為全寬的交錯圖文網格。
07
動效與互動
200msmicro
400mssmall
1000msmedium
cubic-bezier(0.19,1,0.22,1)easing
互動元素採用細膩的透明度與變形過渡效果
文字連結與按鈕的顏色變化與細微透明度轉換 · 平滑過渡至新頁面區塊或外部連結
08
組件
- button 藥丸形狀的外框按鈕，具黑色邊框與大寫文字，或為帶有前置箭頭圖示的純文字連結。
- card 內容以大型分割畫面區塊呈現，而非傳統卡片形式。
- chip 極少量使用標籤元件，導覽專注於簡潔的文字連結。
- input 標準表單欄位，配有細邊框。
- hero 大型分割畫面區塊，一側為大型標題，另一側為全版面的生活風格圖片。
09
文案語氣與禁用清單
- 語氣 專業、令人信賴，並著重於合作關係
- 標題風格 直接且以效益為導向的陳述，關於設計與生產
- 按鈕文案 行動導向的提示語，如「立即聯絡我們」或「協助打造您的品牌」
- 勿使用鮮豔或霓虹色調——截圖顯示為柔和、大地色系的米色、棕色與黑色配色
- 勿使用厚重的投影效果——截圖顯示元素上極簡、幾乎難以察覺的陰影
- 勿使用置中排列的主文案——截圖顯示標題與內文皆採左對齊
- 勿使用擁擠的多欄位版面配置——截圖顯示簡潔、寬敞的分割畫面網格
- 勿使用裝飾性或手寫風格字體——截圖顯示簡潔、功能性的 grotesque-sans 字體排印
- 勿使用圓角卡片與柔和背景——截圖顯示銳利的全出血圖片與清晰的邊框
- 避免: 避免侵略性的銷售用語
- 避免: 避免過度隨意或俚語過多的文案
- 避免: 避免使用與飲料生產無關的複雜術語
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這是一個飲料生產與包裝工作室的 B2B 服務網站。設計簡潔、專業，並植根於以米色（#F2EFE3）、黑色（#000000）與柔和灰色（#6A6965）組成的大地色系配色。字體排印採用簡潔的 grotesque-sans，標題使用緊湊的負字距，營造現代且結構化的感受。版面配置運用大型分割畫面區塊，將粗體文字與高品質產品攝影結合。關鍵限制：勿引入鮮豔的強調色或漸層；維持溫暖、中性的美學。勿使用置中文字版面；堅持強烈的左對齊。避免擁擠、多欄位的網格，改採寬敞、具呼吸感的分割畫面配置。
en · zh-CN · zh-TW · ja · ko