Catalog›Plugins›Media, design & games›gitdiagramGgitdiagramArchitecture diagrams, explanations and Mermaid source for any public GitHub repository, from gitdiagram.com. Open site Open in the app JSON README (API)Architecture diagrams, explanations and Mermaid source for any public GitHub repository, from gitdiagram.com.READMELoading documentation…# GitDiagram Visualize any codebase: turn any public or private GitHub repository into an interactive architecture diagram, or watch it explained in a one-minute narrated video. AI agents can use it too, through the [MCP server](#use-gitdiagram-from-ai-agents) or the Markdown version of any diagram (`gitdiagram.com/owner/repo.md`). **[Try GitDiagram →](https://gitdiagram.com/)** · Or replace `hub` with `diagram` in any GitHub repository URL. [](https://gitdiagram.com/) [](LICENSE) [](https://ko-fi.com/ahmedkhaleel2004) <!-- sponsor:start --> > <a href="https://gitdiagram.com/out/coderabbit-2026-10?placement=readme"><picture><source media="(prefers-color-scheme: dark)" srcset="./public/sponsors/coderabbit-wordmark-white.svg" /><img src="https://raw.githubusercontent.com/ahmedkhaleel2004/gitdiagram/HEAD/public/sponsors/coderabbit-wordmark.svg" alt="CodeRabbit" width="156" align="middle" /></picture></a> <sub>Sponsored</sub> > > AI code reviews for your pull requests. [Try CodeRabbit →](https://gitdiagram.com/out/coderabbit-2026-10?placement=readme) <!-- sponsor:end --> ## New: explainer videos GitDiagram can now turn a repository into a narrated video of about a minute. The video starts with what the project is for and what people do with it, then shows briefly how its main parts fit together and one decision under the hood. [](https://gitdiagram.com/ahmedkhaleel2004/gitdiagram/video) - **[Watch the gallery →](https://gitdiagram.com/videos)** or add `/video` to any diagram URL, such as `gitdiagram.com/owner/repo/video`. - **Download an MP4** in landscape or vertical (9:16), with captions burned in. - **Making new videos is in early access.** Anyone can watch videos that already exist. ## Features - **Watch a repository explained** in a narrated video, or press **Video** on any diagram page. - **Explore the architecture** with an AI-generated diagram and streamed explanation. - **Jump to the code** by clicking any component's linked file or directory. - **Use private repositories** with a GitHub token via **Private Repos** in the header. - **Export diagrams** as PNG or copy the Mermaid source. ## Use GitDiagram from AI agents GitDiagram is a remote MCP server at `https://gitdiagram.com/mcp` (no key or sign-in). Agents can read a public repository's architecture explanation, components, connections and Mermaid source, search the stored diagrams, and get explainer videos. [](https://claude.ai/customize/connectors?modal=add-custom-connector&connectorName=GitDiagram&connectorUrl=https%3A%2F%2Fgitdiagram.com%2Fmcp) [](https://cursor.com/link/mcp/install?name=gitdiagram&config=eyJ1cmwiOiJodHRwczovL2dpdGRpYWdyYW0uY29tL21jcCJ9) [](https://insiders.vscode.dev/redirect/mcp/install?name=gitdiagram&config=%7B%22type%22%3A%22http%22%2C%22url%22%3A%22https%3A%2F%2Fgitdiagram.com%2Fmcp%22%7D) [](https://insiders.vscode.dev/redirect/mcp/install?name=gitdiagram&config=%7B%22type%22%3A%22http%22%2C%22url%22%3A%22https%3A%2F%2Fgitdiagram.com%2Fmcp%22%7D&quality=insiders) ```bash # Claude Code: the plugin adds the MCP server and a /gitdiagram skill claude plugin marketplace add ahmedkhaleel2004/gitdiagram claude plugin install gitdiagram@gitdiagram # ...or just the MCP server claude mcp add --transport http gitdiagram https://gitdiagram.com/mcp # Codex codex mcp add gitdiagram --url https://gitdiagram.com/mcp # Gemini CLI gemini extensions install https://github.com/ahmedkhaleel2004/gitdiagram # GitHub Copilot CLI copilot mcp add --transport http gitdiagram https://gitdiagram.com/mcp ``` In other clients (ChatGPT, Windsurf, Zed, LM Studio, Goose and more), add a remote MCP server with the URL `https://gitdiagram.com/mcp`. Then ask something like "how is fastapi/fastapi structured?". ## Run locally Requires [Bun](https://bun.sh/), Cloudflare R2, Upstash Redis, and an OpenAI or OpenRouter API key. See the [setup guide](https://github.com/ahmedkhaleel2004/gitdiagram/blob/HEAD/docs/dev-setup.md) for prerequisites and configuration. ```bash git clone https://github.com/ahmedkhaleel2004/gitdiagram.git cd gitdiagram bun install cp .env.example .env ``` Fill in `.env` using the [configuration guide](https://github.com/ahmedkhaleel2004/gitdiagram/blob/HEAD/docs/dev-setup.md#configure), then start the app: ```bash bun run dev ``` Open [localhost:3000](http://localhost:3000). Explainer videos are off by default. To turn them on, set `VIDEO_EXPLAINER_ENABLED=1`, `NEXT_PUBLIC_VIDEO_EXPLAINER=1`, `ANTHROPIC_API_KEY`, `OPENAI_API_KEY` and `OPENROUTER_API_KEY` (for the voice) in `.env`. See `.env.example` for the other video settings. ## Development Built with Next.js, React, TypeScript, Tailwind CSS, and Mermaid. Videos use Claude or GPT for the script and scenes and OpenRouter (Gemini 3.8 Flash TTS) for the voice. Deployed on Cloudflare Workers. - [Architecture](https://github.com/ahmedkhaleel2004/gitdiagram/blob/HEAD/docs/architecture.md) — generation pipeline, storage, and API - [Development guide](https://github.com/ahmedkhaleel2004/gitdiagram/blob/HEAD/docs/dev-setup.md) — setup, checks, and deployment - [Deployment recovery](https://github.com/ahmedkhaleel2004/gitdiagram/blob/HEAD/docs/deployment-failover.md) — Railway/Docker fallback Contributions are welcome. Open an issue or pull request with a focused description and [verification notes](https://github.com/ahmedkhaleel2004/gitdiagram/blob/HEAD/docs/dev-setup.md#verify). Inspired by [Romain Courtois](https://github.com/cyclotruc)'s [Gitingest](https://gitingest.com/). DetailsTypePluginsTopicMedia, design & gamesPublisherahmedkhaleel2004SourcegeminiCategoryToolsVersion1.0.0Stars18,663Copies (forks)1,434Proposed changes23Last update2026-10-30T06:52:07ZProject statusActiveLanguageTypeScriptLicenseMITAdded2026-09-30 01:35:51Updated2026-09-30 01:35:51Source idahmedkhaleel2004/gitdiagramMoreMore plugins on Media, design & gamesAll from ahmedkhaleel2004A–Z index
