sequences that terminate HTML script tags early, breaking the page even with standard JSON encoding. The Skill uses jq to write patches to a file and Python to escape angle brackets before injection."}},{"@type":"Question","name":"Can I customize the layout of the generated PR review page?","acceptedAnswer":{"@type":"Answer","text":"Yes. The prebuilt CSS classes and JS utilities are optional helpers. You can add inline style blocks, scripts, SVG diagrams, mermaid charts, tables, or any custom HTML structure that best explains the PR."}}]}]}

pr-review-canvas

Generates an interactive HTML walkthrough of a GitHub pull request with annotated diffs.

1|Updated Mar 27, 2026
One-click install
npx skills add https://github.com/lrstanley/skills --skill pr-review-canvas-lrstanley
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: pr-review-canvas
Source: https://github.com/lrstanley/skills/tree/main/pr-review-canvas
Command: npx skills add https://github.com/lrstanley/skills --skill pr-review-canvas-lrstanley

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Reviewing large GitHub pull requests in the default web UI makes it hard to distinguish core logic changes from mechanical boilerplate, and reviewers lose context scrolling through raw diffs. This Skill turns any PR into a single interactive HTML page that reads like a peer walking you through what matters. ## Core Features & Use Cases - Automated PR Data Fetching: Pulls PR metadata, file diffs, and review comments via the GitHub CLI (gh api) in parallel. - Smart Diff Rendering: Renders unified diffs with import filtering, whitespace-change collapsing, and moved-code detection (blue/purple highlighting for relocated blocks). - Reviewer Annotations: Supports summary boxes, pseudocode explanations, collapsible boilerplate sections, callouts, diagrams, and a review checklist. - Use Case: Paste a GitHub PR URL and ask for a review walkthrough; the Skill produces a dark-themed HTML page served locally at 127.0.0.1 that separates core changes from mechanical ones with per-file annotations. ## Quick Start Paste a GitHub pull request URL and ask the agent to review this PR and generate an interactive walkthrough page.

Frequently Asked Questions about pr-review-canvas

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate an interactive HTML review of a GitHub pull request?▼

Paste the GitHub PR URL and ask for a review or walkthrough. The Skill fetches PR metadata, file diffs, and comments via gh api, writes annotated body HTML, assembles it with a template, and serves the page locally on port 8432.

What tools are required to render a PR review page from GitHub?▼

You need the GitHub CLI (gh) authenticated for API access, jq for safe JSON extraction of patch data, and Python 3 for assembling the final HTML and running a local HTTP server to view it.

Does the diff renderer detect moved code blocks?▼

Yes. The renderer detects blocks of three or more consecutive lines deleted in one location and added identically elsewhere, highlighting them in blue/purple instead of red/green. Near-matches with small edits get a distinct purple tint.

Why must patch data be injected with Python instead of pasted into script tags?▼

Patch strings can contain literal </script> sequences that terminate HTML script tags early, breaking the page even with standard JSON encoding. The Skill uses jq to write patches to a file and Python to escape angle brackets before injection.

Can I customize the layout of the generated PR review page?▼

Yes. The prebuilt CSS classes and JS utilities are optional helpers. You can add inline style blocks, scripts, SVG diagrams, mermaid charts, tables, or any custom HTML structure that best explains the PR.