Developers can visualize code structure with one-minute videos and diagrams by modifying a GitHub URL
When you need to grasp a complex codebase quickly, simply change 'hub' to 'diagram' in the repository URL. GitDiagram accepts public or private GitHub repositories, uses AI to analyze the architecture, and renders it as an interactive diagram. It also explains how key components connect through a one-minute narrated video. This tool is useful for developers and anyone who needs to understand code structure rapidly.
Project structure in a one-minute video
A recently added feature converts repositories into one-minute narrated videos. The video first shows the project's purpose and usage, then illustrates how major parts interlock and briefly explains one internal decision. You can download the video as a landscape MP4 or a vertical (9:16) MP4 with subtitles. The video generation feature is currently in early access, and already generated videos are viewable by anyone.
Integrating with AI agents
GitDiagram provides a remote MCP server that allows AI agents to read repository structures directly. By connecting the https://gitdiagram.com/mcp address without keys or login, agents can retrieve architecture descriptions, components, connections, Mermaid source, saved diagram searches, and explanatory videos for public repositories. You can add the server with a few lines of commands in various clients such as Claude Code, Codex, Gemini CLI, and GitHub Copilot CLI.
Preparation for local execution
After cloning the repository, run bun install, copy .env.example to create a .env file, and fill in the configuration values. Start the app with the bun run dev command to access it at localhost:3000. To enable the explanatory video feature, you must set additional environment variables such as VIDEO_EXPLAINER_ENABLED=1 along with Anthropic, OpenAI, and OpenRouter API keys in the .env file.
Things to check before use
The tool is built with Next.js, React, TypeScript, Tailwind CSS, and Mermaid, and is deployed on Vercel. To use private repositories, you must enter a GitHub token in the Private Repos menu in the header. Diagrams can be exported as PNG or copied as Mermaid source, and clicking a diagram component navigates directly to the corresponding file or directory. Since video generation is in its early stages, it is advisable to verify feature stability before deciding whether to use it.
