Skip to content
Get packs

GitDiagram

Turns a GitHub repository into an interactive architecture diagram or a one-minute narrated video.

GitHub Download source
Stars
18.7k
Forks
1.4k
Licence
MIT
Language
TypeScript
Last update
7 days ago
Type
App

What it is

GitDiagram takes a public or private GitHub repository and generates an interactive architecture diagram of it, with an AI-written explanation. You can also watch a short narrated video that explains what the project is for and how its main parts fit together. Replacing 'hub' with 'diagram' in a GitHub URL opens the diagram view.

  • Open a GitHub repo's diagram by changing 'github.com' URLs' 'hub' to 'diagram'
  • Click a component in a diagram to jump to its linked file or directory
  • Export a diagram as PNG or copy its Mermaid source
  • Ask an AI agent through the MCP server how a public repository is structured
  • Watch an existing explainer video for a repository

Great for

  • Developers getting oriented in an unfamiliar codebase
  • Students studying how a real project is structured
  • Teams wanting a quick visual overview to share with others
  • People who want to explore a repo's components and jump to their linked files
  • AI agent users who want architecture context for a repository

Not ideal for

  • Anyone needing guaranteed-accurate documentation, since the diagrams and explanations are AI-generated and the README does not describe verification
  • People who need to run it locally without setting up several paid services, because the local setup requires Bun, Cloudflare R2, Upstash Redis and an OpenAI or OpenRouter key
  • Users wanting to create new explainer videos freely, since making new videos is described as in early access
Step-by-step guide: how to use GitDiagramInstall, first run, examples, tips and FAQs
GitDiagram alternativesGitDiagram vs OpenHandsDeepWiki vs GitDiagramGitDiagram vs Gitingest

How to get it

  1. 1

    Clone and build from source

    You'll need: Bun · Cloudflare R2 account · Upstash Redis account · OpenAI or OpenRouter API key

    Clone the repository

    git clone https://github.com/ahmedkhaleel2004/gitdiagram.git

    Enter the project folder

    cd gitdiagram

    Install dependencies

    bun install

    Create your environment file

    cp .env.example .env
  2. 2

    Run it

    • Fill in the .env file using the configuration guide in docs/dev-setup.md
    • Start the app with bun run dev
    • Open localhost:3000 in your browser
    • Or, without installing, replace 'hub' with 'diagram' in any GitHub repository URL on gitdiagram.com
  3. 3

    Get the most out of it

    • Use the MCP server at https://gitdiagram.com/mcp with Claude, Cursor, VS Code, Codex or Gemini CLI to ask about repo structure
    • Append /video to any diagram URL to watch its explainer video, if one exists
    • Use the Markdown version of a diagram at gitdiagram.com/owner/repo.md
    • Add a GitHub token through Private Repos in the header to diagram private repositories
    • Read docs/architecture.md to understand the generation pipeline before modifying it

Downloads

Source code (.zip)main branch · straight from GitHubOfficial website & docsgitdiagram.com

Strengths

  • Free to use on the hosted site, with no key or sign-in needed for the MCP server
  • Interactive diagrams link components to the actual code
  • Open source under the MIT license, so you can read and modify it

Trade-offs

  • Diagrams and explanations are AI-generated, so details may be wrong and should be checked against the code
  • Running it locally requires several external services and API keys, and video generation is off by default
  • Making new explainer videos is described as early access, so availability may be limited

How it compares

ProjectStarsTypeLevelUpdatedBest for
gitdiagram (this)18.7kAppintermediate7 days agoDevelopers getting oriented in an unfamiliar codebase
gitingest16.1kDev toolbeginner4 days agoDevelopers who want to give an AI assistant context about a codebase
OpenHands92.5kAppintermediate4 days agoDevelopers who want coding agents running on a server while their laptop is off
deepwiki-open18.3kAppintermediate8 days agoDevelopers trying to understand a large or unfamiliar codebase
ECC295kDev toolintermediate4 days agoDevelopers who already use Claude Code and want a shared workflow for planning, testing and review
ponytail182kAI model / agentbeginner8 days agoDevelopers who use Claude Code or similar AI agents and find the generated code too long

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.