GitHub

Difficulty:
Company
github

Effect Preview

Style Description

Code-first platform. Feature-dense, blue-white precision, Primer design foundation

Tags

GitHubDeveloper

Prompt Template

Base Template
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:.

Variant Prompts

📱 Mobile
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.
📊 Dashboard
Design a dashboard with GitHub design language. Use GitHub color identity with #0969da accents. Data-rich, organized, clear hierarchy.
📄 Landing Page
Design a landing page with GitHub visual identity. Use GitHub color identity with #0969da accents. Compelling, conversion-focused.

Usage Examples

GitHub App

Web App
Build a web app with GitHub design language and #0969da color system.

GitHub Dashboard

Dashboard
Create a dashboard using GitHub style with data visualization and - Background: typography.

✅ Best For

  • Developer
  • Brand-consistent interfaces
  • Modern web applications

✅ Avoid For

  • Unrelated design aesthetics
  • Different brand guidelines