精選 · 開放 · 免費

Joinlava

一個運用鮮明漸層與粗體字體來創造充滿活力、表達性身份的社群音訊平台。

01

設計氣質 DNA

如同夜空中絢爛的霓虹燈光秀，展現多元聲音的活力。

02

色彩

以深色模式為基底，採用鮮明多彩漸層象徵能量與創造力。

03

字型

grotesque-sans · humanist-sans

• display53px · 900
• subtitle18px · 400
• body14px · 400
• label11px · 700

標題使用緊湊的 grotesque-sans，粗體（900），並帶有負值字間距。 · 內文使用高可讀性 humanist-sans，14px。 · 強調標籤採用加寬字間距的全大寫樣式，並填入彩虹漸層色彩。

04

間距

遵循一致的 4px 格線系統，並搭配充裕的垂直內距（例如約 37px），讓元素在深色背景上有足夠呼吸空間。

05

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

主要邊框為細微的白色或深灰色，通常為 1px solid，有時用於分隔格線區域。

None: None

06

版面

英雄區塊採用居中單欄版面，過渡至雙欄功能區塊。

07

動效與互動

互動元素上的細微 hover 過渡效果。 · 關鍵強調區域（如頂部邊框）的漸層動畫或輝光效果。

按鈕與互動元素可能具備細微的色彩變化或邊框輝光。 · 所有主要互動元素使用標準指標游標。

08

組件

• button 膠囊形按鈕，黑色背景、白色文字，帶有 1px 多彩漸層邊框。
• card 圓角卡片（15-20px 半徑），通常包含圖片或 UI 模型，有時帶有深層陰影。
• chip 小型圓角標籤，常為深色背景搭配淺色文字。
• input 極簡輸入欄位，深色背景搭配細微邊框。
• hero 大型居中區塊，深色背景上呈現粗體、超大白色文字，並以彩色浮動元素點綴。

09

文案語氣與禁用清單

• 語氣 充滿活力、自信且以社群為核心。
• 標題風格 粗體、具表達力且直接，常使用大型粗重字體。
• 按鈕文案 簡潔並以行動為導向，例如「取得應用程式」。

• 勿使用白色背景——截圖顯示為深黑色（#010101）背景。
• 勿使用襯線字體作為標題——截圖顯示為粗重緊湊的 grotesque-sans。
• 勿使用單色實體強調按鈕——截圖顯示為帶有多彩漸層邊框的按鈕。
• 勿在標題上使用寬鬆字間距——截圖顯示為緊湊的負值字間距（-1px）。
• 勿使用纖細的字重作為內文——截圖顯示為清晰可讀的中等字重。
• 勿使用單一靜態顏色作為品牌識別——截圖顯示以顯眼的多彩漸層作為關鍵識別。
• 避免: 正式或過度企業化的語言。
• 避免: 缺乏鮮明感的柔和或單色調色盤。
• 避免: 纖細脆弱的字體，顯得軟弱無力。

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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