精選 · 開放 · 免費

Campsite

一個專注的團隊溝通工具，以有組織的貼文取代吵雜的聊天。

01

設計氣質 DNA

一個寧靜、組織完善的團隊貼文圖書館。

02

色彩

高對比的極簡主義：以深墨色為基底的簡潔白色表面，搭配鮮豔的橘紅色作為關鍵動作的強調色。

03

字型

humanist-sans · monospace

• display56px · 500
• h232px · 600
• body16px · 400
• small14px · 400

大型展示文字使用負字距調整 · 內文使用一般字重 · 章節標題使用半粗體

04

間距

一致的 4px 基礎網格

05

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

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

0px 3px 6px -3px rgba(0, 0, 0, 0.05) · 0px 1px 2px 0px rgba(0, 0, 0, 0.05) · 0px 1px 0px -1px rgba(0, 0, 0, 0.05)

06

版面

標準的行銷網站佈局，內容置中並留有寬敞的空間。

07

動效與互動

滑鼠懸停時的平滑顏色過渡 · 互動時細微的 box-shadow 變化

細微的顏色或背景變化。 · 立即的視覺反饋。

08

組件

• button 圓潤的膠囊形狀，使用外框或實心的主色調。
• card 乾淨的白色容器，帶有細微邊框與柔和陰影。
• chip 小型圓角標籤，帶有淡淡的背景色。
• input 標準的文字輸入欄位，配有淺色邊框。
• hero 大型置中標題，搭配輔助性副標題與產品截圖。

09

文案語氣與禁用清單

• 語氣 專業且平易近人。
• 標題風格 簡潔、直接，並以效益為導向。
• 按鈕文案 簡單、行動導向的文字置於圓角按鈕內。

• 避免使用深色或暗黑模式背景——截圖顯示明亮的白色表面 (#ffffff)。
• 避免使用尖銳、未圓角的邊角——截圖顯示膠囊形狀 (9999px) 與圓角卡片 (8px–12px)。
• 避免使用喧鬧、複雜的漸層——截圖顯示乾淨的純色背景與單一橘色強調。
• 避免使用過度裝飾或手寫字體——截圖顯示乾淨、功能性的無襯線字體。
• 避免元素過於擁擠——截圖顯示寬敞的留白（基礎 4px 網格）。
• 避免使用生硬的陰影——截圖顯示非常細微、低透明度的 box-shadow。
• 避免: 充滿術語的語言
• 避免: 過於大聲或具侵略性的行銷文案
• 避免: 視覺雜亂

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

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