精選 · 開放 · 免費

Light

鏈上網路時代的開發者基礎積木。

01

設計氣質 DNA

建構下一代區塊鏈應用程式的現代工具包。

02

色彩

乾淨、高對比的介面，使用鮮明的紫色作為主要操作的強調色。

03

字型

grotesque-sans · humanist-sans · monospace

• display52px · 700
• headline32px · 700
• body16px · 400
• label14px · 500

標題使用粗體字重以建立強烈的層級。 · 大型展示文字保持緊湊的行距。 · 內文應具備適中的行高以確保可讀性。

04

間距

以一致的 4px 為基礎單位，搭配模組化比例，用於垂直節奏和元件內距。

05

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

1px solid rgba(0, 0, 0, 0.05)

0 2px 1px 0 rgba(0, 0, 0, 0.03) · 0 1px 0 0 rgba(0, 0, 0, 0.05) · 0 0 24px 0 rgba(128, 128, 128, 0.1)

06

版面

以全寬容器為中心的主視覺，過渡到用於功能區的多欄網格。

07

動效與互動

懸停狀態下微妙的透明度和變換過渡。 · 所有互動元件的流暢緩動。

互動元素上的微妙色彩變化或透明度調整。 · 立即的視覺回饋，帶有輕微的縮放或色彩偏移。

08

組件

• button 主要按鈕為藥丸形狀，帶有紫色背景；次要按鈕為幽靈/外框樣式，帶有文字。
• card 白色卡片帶有柔和陰影和圓角，用於功能亮點。
• chip 圓角標籤，帶有背景色和文字，用於分類。
• input 文字輸入框帶有微妙邊框和圓角。
• hero 全寬居中區塊，帶有大型字體和顯眼的行動呼籲按鈕。

09

文案語氣與禁用清單

• 語氣 專業、技術性且具前瞻性。
• 標題風格 大膽、清晰且以行動為導向的陳述。
• 按鈕文案 直接且具鼓勵性，使用如「開始建構」和「閱讀文件」等動詞。

• 不要使用細體或輕字重的標題——截圖顯示粗體字重 700。
• 不要使用寬闊、方正的容器——截圖顯示具有清晰邊距的中央內容區域。
• 不要在主要元素上使用銳利的圓角——截圖顯示圓角（藥丸按鈕、圓角卡片）。
• 不要為主要頁面使用深色背景——截圖顯示淺灰色/灰白色背景。
• 不要為主要的行動呼籲使用微妙或柔和的強調色——截圖顯示鮮明、高彩度的紫色。
• 不要使用複雜、多色的漸層作為主要背景——截圖顯示乾淨的純色區塊。
• 避免: 隨意的語言
• 避免: 未經解釋的過多術語
• 避免: 被動語態

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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