Agent skill · writing content · github

pr-screenshots

Embed before/after screenshots and annotated images in pull request descriptions. Covers PR description patterns, image upload for Azure DevOps and GitHub, and sizing best practices.

Why this skill is useful

Provides specific patterns and commands for embedding images in PR descriptions that the AI wouldn't reliably generate on its own.

What it needs

About 2k tokens when loaded. Last updated 2026-08-07. 37,534 stars on the source repository.

What this skill does

PR Screenshots Embed before/after screenshots in pull request descriptions so reviewers can see the visual change without checking out the branch. When to Use This Skill Use this skill when a PR changes something visible: Layout, styling, CSS Charts, dashboards, data visualizations UI components, forms, modals Error messages, CLI output, log formatting PR Description Pattern Place screenshots directly in the PR description body. Avoid wrapping them in <details> collapse — reviewers are more likely to look at images they can see without clicking. Keep the text brief. A sentence or two per image describing what the reader should notice. Let the image carry most of the communication. Multiple changes For PRs with several visual changes, use separate before/after pairs with headings: Image Sizing Take screenshots at native 1x resolution — don't resize with PIL (creates artifacts) Control display size in HTML when images are too large: Before/after pairs must use the same viewport width and crop — otherwise the comparison is meaningless Uploading Images Azure DevOps Upload images as PR attachments via the REST API: Reference in the PR description: Azure DevOps gotchas: Use {org}.visualstudio.com NOT dev.azure.com/{org} — AzDO's markdown renderer uses .visualstudio.com. The dev.azure.com format loads noticeably slower Use POST not PUT (PUT returns 405) API version must be 7.1-preview.1 Can't re-upload with the same filename — use a new name (e.g. screenshot-v2.png) Use HttpClient not Invoke-RestMethod — IRM can corrupt binary data Repo-relative paths don't work in PR descriptions — must use full URLs Don't commit images to the branch just for PR screenshots GitHub ⚠️ Work in progress. GitHub's drag-and-drop image upload uses internal endpoints that require browser cookies. There's no clean public API for uploading images to PR descriptions yet. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills github/pr-screenshots

View the source on GitHub

Browse the @skills marketplace