精選 · 開放 · 免費

Starface

一個充滿活力、俏皮的保養品電商體驗，將產品視為有趣的收藏品。

01

設計氣質 DNA

一場喧鬧、充滿活力的青少年雜誌，遇上一家波普藝術糖果店。

02

色彩

使用標誌性的電光黃、鮮亮的洋紅色與綠色，搭配純黑邊框，進行高飽和度的色塊搭配。

03

字型

geometric-sans · monospace

• display40px · 700
• body16px · 400

文字一致使用小寫。 · 几乎所有功能性和描述性文字使用 monospace 字體。 · 具衝擊力的標題使用厚重、粗體、圓潤的無襯線字體。

04

間距

卡片內部一致的內距（25px）維持了統一的節奏，儘管卡片尺寸各異。

05

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

以粗壯的 2px 黑色邊框或實心黑色結構性間隙，定義每個元素並分隔色塊。

無

06

版面

一個嚴謹的全出血色塊網格，以粗壯的黑色線條分隔。

07

動效與互動

產品圖片在 hover 時微幅縮放。 · Opacity 淡入實現流暢過渡。

互動元素在 hover 時有微幅的 transform 縮放或 opacity 變化。 · 即時、清晰的回饋，無明顯延遲。

08

組件

• button 黑色邊框、透明背景配文字，或實心黑色背景。
• card 色彩鮮豔的實心矩形，具圓角（24px）、粗邊框，以及清晰的圖片/文字分隔。
• chip 藥丸形或小矩形的色彩標籤，用於類別。
• input 標準的有邊框輸入框，符合大膽的輪廓美學。
• hero 大型、多彩、圖片為主的區塊，佔據主要視覺區域。

09

文案語氣與禁用清單

• 語氣 極度隨和、友善且略帶混亂，使用網路流行語和表情符號。
• 標題風格 簡短、有力、小寫且熱情。
• 按鈕文案 直接、小寫且以行動為導向。

• 不要使用襯線字體 — 螢幕截圖顯示僅使用 monospace 和幾何圓潤無襯線字體。
• 不要使用大寫文字 — 螢幕截圖顯示文字全部為小寫。
• 不要使用細灰色邊框 — 螢幕截圖顯示粗壯的實心黑色結構線條。
• 不要使用複雜陰影 — 螢幕截圖顯示無深度效果的平面色塊。
• 不要使用柔和或粉彩色盤 — 螢幕截圖顯示高飽和度、霓虹感的主色調。
• 不要使用密集的文字區塊 — 螢幕截圖顯示簡短、有力且極易掃讀的文案。
• 避免: 正式語言
• 避免: 大寫文字
• 避免: 襯線字體
• 避免: 柔和色彩
• 避免: 複雜句型

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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