# pr-review-canvas

Generates a standalone interactive HTML walkthrough for any GitHub pull request. It helps reviewers focus on core architecture by folding boilerplate and rendering smart diffs.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 2300 installs · ★ 14099
- Author: cursor
- License: not stated · policy=link-only · description only; the file stays with the author
- Source: https://github.com/cursor/plugins/tree/HEAD/cursor-team-kit/skills/pr-review-canvas/SKILL.md
- Updated: 2026-10-25
- HTML: https://affpapa.org/en/nevibecode/skills/pr-review-canvas

## What it does

The skill transforms a GitHub pull request into a self-contained dark-theme HTML report. The assistant executes `gh api` calls in parallel to pull PR metadata, review comments, and diff patches. Files are split into core changes and boilerplate, with routine edits collapsed by default.

Inside, the report relies on bundled `styles.css`, `renderer.js`, and `template.html`. The renderer identifies relocated code chunks with colored tints, collapses whitespace-only modifications, and lets you replace verbose logic with concise pseudocode summaries.

The host machine requires `gh`, `jq`, and `python3`. Python is mandatory for safely embedding diff payloads into the HTML template, preventing premature tag termination when patches contain raw script syntax.

## Requirements
- Works with: GitHub

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add cursor/plugins --skill pr-review-canvas -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/pr-review-canvas/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/pr-review-canvas/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add cursor/plugins --skill pr-review-canvas -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/pr-review-canvas/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add cursor/plugins --skill pr-review-canvas -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/pr-review-canvas/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install cursor/plugins pr-review-canvas
```

2. **Manually: put the files in place**
- File: `.github/skills/pr-review-canvas/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add cursor/plugins --skill pr-review-canvas -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/cursor/plugins --path cursor-team-kit/skills/pr-review-canvas
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/pr-review-canvas/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add cursor/plugins --skill pr-review-canvas -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/cursor/plugins/tree/HEAD/cursor-team-kit/skills/pr-review-canvas/SKILL.md

## When to use it
- generate an interactive HTML walkthrough for a GitHub pull request
- separate critical architecture changes from mechanical boilerplate
- replace verbose implementation diffs with high-level pseudocode
- highlight moved code blocks and collapse whitespace edits

## Example prompts
- Review this PR and generate an interactive HTML walkthrough.
- Analyze this pull request, collapse mechanical files, and add review annotations.

## Similar
- [improve-codebase-architecture](https://affpapa.org/en/nevibecode/skills/improve-codebase-architecture.md) — skill · 1163035 installs
- [tdd](https://affpapa.org/en/nevibecode/skills/tdd.md) — skill · 1141062 installs
- [triage](https://affpapa.org/en/nevibecode/skills/triage.md) — skill · 990453 installs
- [codebase-design](https://affpapa.org/en/nevibecode/skills/codebase-design.md) — skill · 850344 installs
- [code-review](https://affpapa.org/en/nevibecode/skills/code-review.md) — skill · 789521 installs
- [implement](https://affpapa.org/en/nevibecode/skills/implement.md) — skill · 774700 installs

From the same set: [cursor/plugins](https://affpapa.org/en/nevibecode/by/cursor/plugins.md) — 47 cards

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md