PostHog 是「產品脈絡層」，能自動診斷問題、修復缺陷甚至生成 PR。它的品牌氣質刻意反企業化：配色是鼠尾草橄欖綠的暖調而非慣用藍，IBM Plex Sans 以 700/800 字重配 1.5 以上行高，藏起品牌橙（#F54E00）只在懸停時蹦出來給你驚喜，手繪刺蝟插畫貫穿始終，描邊與底色都帶鼠尾草調（#bfc1b7/#eeefe9）。適合開發者友善、有性格的分析產品。
PostHog後端與資料
提示詞範本
基礎範本
Design a PostHog-inspired interface. - Warm sage/olive color palette instead of conventional blues — earthy and approachable; - IBM Plex Sans Variable font at bold weights (700/800) for headings with generous 1.50+ line-heights; - Hidden brand orange (#F54E00) that only appears on hover interactions — a delightful surprise; - Hand-drawn hedgehog illustrations and playful imagery — deliberately anti-corporate; - Sage-tinted borders (#bfc1b7) and backgrounds (#eeefe9) creating a unified warm-green system. Colors: #4d4f46, #23251d, #F54E00, #F7A501 with #F54E00 accent. Typography: ui-monospace.
變體提示詞
📱 行動裝置
Design a mobile app with PostHog aesthetics. Use PostHog color identity with #F54E00 accents. Clean, touch-friendly, native feel.
💻 Web 端
Design a web application with PostHog style. Use PostHog color identity with #F54E00 accents. Professional, responsive layout.
📊 儀表板
Design a dashboard with PostHog design language. Use PostHog color identity with #F54E00 accents. Data-rich, organized, clear hierarchy.
📄 到達頁
Design a landing page with PostHog visual identity. Use PostHog color identity with #F54E00 accents. Compelling, conversion-focused.
使用範例
PostHog 應用程式
Web 端Build a web app with PostHog design language and #F54E00 color system.
PostHog 儀表板
儀表板Create a dashboard using PostHog style with data visualization and ui-monospace typography.
✅ 適用情境
- 後端系統
- 分析與監控類開發者工具
- 資料密集的深色儀表板
❌ 不適用情境
- 奢華零售品牌頁
- 柔和粉彩的生活風格產品
DESIGN.md 檔案
符合 design.md 開放格式的設計系統描述，可複製或下載後交給 AI 程式設計工具使用。