GitHub 是全球最廣泛採用的開發者平台，數百萬開發者與最大的開源社群在其中共同建構軟體。其介面用純白（#ffffff）或深海軍黑（#0d1117）作底，髮絲級灰描邊（#d0d7de）勾勒每個面板，Primer 藍（#0969da）管連結與主操作、GitHub 綠（#1a7f37）管成功狀態，system-ui 配 SFMono，列表列密集、留白克制。適合開發者平台與程式碼工具。
GitHub開發者工具
提示詞範本
基礎範本
Design a GitHub-inspired interface. - True white canvas (#ffffff) or deep navy-black (#0d1117) — no warmth, no tint; - Hairline gray borders (#d0d7de) define every pane and panel; - Primer blue (#0969da) for links/primary; GitHub green (#1a7f37) for success/merge; - system-ui for prose; SFMono for code — no custom typeface; - Dense list rows with minimal padding; whitespace is rare. Colors: #ffffff, #f6f8fa, #eaeef2, #1f2328 with #0969da accent. Typography: - Background:.
變體提示詞
📱 行動裝置
Design a mobile app with GitHub aesthetics. Use GitHub color identity with #0969da accents. Clean, touch-friendly, native feel.
💻 Web 端
Design a web application with GitHub style. Use GitHub color identity with #0969da accents. Professional, responsive layout.
📊 儀表板
Design a dashboard with GitHub design language. Use GitHub color identity with #0969da accents. Data-rich, organized, clear hierarchy.
📄 到達頁
Design a landing page with GitHub visual identity. Use GitHub color identity with #0969da accents. Compelling, conversion-focused.
使用範例
GitHub 應用程式
Web 端Build a web app with GitHub design language and #0969da color system.
GitHub 儀表板
儀表板Create a dashboard using GitHub style with data visualization and - Background: typography.
✅ 適用情境
- 開發者工具
- 程式碼託管與協作平台
- 開發者工具的功能密集介面
❌ 不適用情境
- 面向大眾的電商零售
- 藝術化品牌形象頁
DESIGN.md 檔案
符合 design.md 開放格式的設計系統描述，可複製或下載後交給 AI 程式設計工具使用。