Turn Pull Requests Into Animated Diagrams With PR Lens

A four-hundred-line pull request is hard to review because the diff shows text changes, not how the system moves. PR Lens, a 2k-star MIT project, draws the change instead: animated architecture and data-flow diagrams posted as a comment inside the pull request itself, so you understand it visually before reading a line of code.

Why This Skill Matters

The renderer is custom-built, and the README is direct about the comparison: "Not Mermaid, better." The diagrams show code additions, removals, and changes as cards and paths — with zoom, interactive canvases, and a walkthrough of the change — and still scale to very large systems. The README's Hall of Fame includes react/react#13968, the pull request behind React Hooks: 36 files, +5,868/−130, drawn across five lanes.

Installation

Two routes solve different problems. The GitHub App is the zero-config one: install it from github.com/apps/coldtea-pr-lens on any repository, open a pull request, and the diagram shows up as one comment that updates on every push — no model key required. PR Lens also runs on GitLab (CI/CD component) and Bitbucket (pipe).

The agent skill is the second route, for diagrams before a pull request exists:

npx skills add coldteadotai/pr-lens

Real Workflow: Diagram Your Change Before You Open the PR

After installing the skill, ask your agent:

用 PR Lens 把你刚才的改动画成图，附到拉取请求描述里。

The agent reads the diff and writes the diagram file, then runs npx @coldtea/pr-lens-cli validate until the file passes every check. Only then does it draw the diagram and attach it with gh pr create --attach, so the diagram is there the moment the pull request opens. If a diagram gets a name wrong, the skill teaches the agent to fix .github/pr-lens.yml instead of hand-editing the files it generated.

You can also watch your agent work on a live canvas: connect it, ask follow-up questions, zoom into any part of the diagram, or drag across a few cards and ask about them. The README lists Claude Code, Codex, Gemini CLI, Cursor, OpenCode, and Copilot as agent options, and every diagram comes in a light and a dark version.

Teams that want the same comment from their own CI can use the GitHub Action instead: .github/workflows/pr-lens.yml running coldteadotai/pr-lens/packages/action@v0 with a model key saved as a repository secret. It works with any service that speaks /chat/completions — the README names OpenAI and Gemini.

Tips

• Start with the GitHub App on a busy repository — one comment per pull request, kept current on every push, is the lowest-effort way to see whether the format works for your team.
• Use the agent skill for codebase understanding, not just reviews: ask it to diagram a subsystem you are about to refactor.
• The monorepo-scale view uses the same visual language as a one-card change — lanes, cards, colors for what changed, and followable paths.
• Self-hosting the canvas has its own section in the README.

When Not to Use This

The diagrams are for understanding, not approval: you still read the code that matters. And the App route draws for you, while the Action route needs your own model key — if neither fits your workflow, your agent can still draw diagrams locally through the skill.

See the leaderboard for more skills.