New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Screenshotting Changelog

by spencerpauly in spencerpauly/awesome-cursor-skills

Generate a visual changelog or PR description by taking before/after screenshots of UI changes using Cursor's built-in browser.

CC0-1.0Auto-check passedDevelopment

Install Screenshotting Changelog

skills CLI
$ npx skills add spencerpauly/awesome-cursor-skills --skill screenshotting-changelog -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install spencerpauly/awesome-cursor-skills screenshotting-changelog --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/spencerpauly/awesome-cursor-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/resources/screenshotting-changelog .claude/skills/screenshotting-changelog && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
screenshotting-changelog
GitHub stars
844
Token cost
~617 tokens
SKILL.md length
219 words
Files
1
Skills in repo
60
Repo updated
First seen
Licence
CC0-1.0

At a glance

Generate a visual changelog or PR description by taking before/after screenshots of UI changes using Cursor's built-in browser.

  • Works in 5 steps: Capture the "before" state — before… → Switch to the feature branch — apply… → Capture the "after" state — screenshot… → …
  • Preparing a PR with visual changes
  • SKILL.md covers Steps, Variations and Notes
  • Calls git

What it does

Screenshotting Changelog is an agent skill from spencerpauly/awesome-cursor-skills. Generate a visual changelog or PR description by taking before/after screenshots of UI changes using Cursor's built-in browser. Use when preparing a PR with visual changes.

Its SKILL.md is about 620 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Development, covering Changelog and release notes, Pull requests and Browser automation. The repository describes itself as: A curated list of awesome skills for Cursor. The licence is CC0-1.0.

When your agent uses it

  • Preparing a PR with visual changes
  • Tasks that involve Changelog and release notes
  • Tasks that involve Pull requests

Example prompts

  • “/screenshotting-changelog”

Workflow steps

5 steps, taken from the first numbered list in SKILL.md.

  1. Capture the "before" state — before making changes (or on the base branch), start the dev server and screenshot the affected pages
  2. Switch to the feature branch — apply your changes
  3. Capture the "after" state — screenshot the same pages
  4. Generate the changelog — create a summary describing what changed visually
  5. Include in the PR description — paste the visual changelog into the PR body so reviewers can see the changes at a glance without running…

What it can do on your machine

Read from SKILL.md and the folder at commit 99cd265. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • git

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md. Its commands use git, which can reach the network depending on how they are called.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Screenshotting Changelog loads about 617 tokens when it runs. Until then it costs about 49 tokens; SKILL.md has 219 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~49
When it runs · the whole SKILL.md, loaded when a task matches
~617

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from spencerpauly/awesome-cursor-skills at commit 99cd265, republished under its CC0-1.0 licence (© spencerpauly). 219 words, ~617 tokens.

Download SKILL.mdSave it as .claude/skills/screenshotting-changelog/SKILL.md (or your agent's skills folder).
name
screenshotting-changelog
description
Generate a visual changelog or PR description by taking before/after screenshots of UI changes using Cursor's built-in browser. Use when preparing a PR with visual changes.

Screenshot Changelog

Use this skill when preparing a pull request that includes visual/UI changes. Capture before and after screenshots to create a visual changelog that reviewers can quickly scan.

Steps

  1. Capture the "before" state — before making changes (or on the base branch), start the dev server and screenshot the affected pages:

    bash
    git stash  # or checkout the base branch

    Start the dev server, then:

    Tool: browser_navigate
Arguments: { "url": "http://localhost:3000/affected-page", "take_screenshot_afterwards": true }
    Tool: browser_take_screenshot
Arguments: { "fullPage": true, "filename": "before-homepage.png" }

    Repeat for each affected page or component state.

  2. Switch to the feature branch — apply your changes:

    bash
    git stash pop  # or checkout the feature branch

    Wait for the dev server to hot-reload (or restart it).

  3. Capture the "after" state — screenshot the same pages:

    Tool: browser_take_screenshot
Arguments: { "fullPage": true, "filename": "after-homepage.png" }

  4. Generate the changelog — create a summary describing what changed visually:

    markdown
    ## Visual Changes

### Homepage
**Before:**
![before](before-homepage.png)

**After:**
![after](after-homepage.png)

Changes: Updated hero section layout, new CTA button color, added testimonials section.

  5. Include in the PR description — paste the visual changelog into the PR body so reviewers can see the changes at a glance without running the app locally.

Variations

  • Responsive comparison: use browser_resize to capture screenshots at mobile (375px), tablet (768px), and desktop (1280px) widths.
  • Dark mode comparison: if the app has a dark mode toggle, capture both themes.
  • Interactive states: capture hover states, open modals, filled forms, and error states.

Notes

  • Screenshots are saved to the workspace. You can reference them in markdown or upload them to the PR.
  • For component-level screenshots, navigate to a Storybook URL or a specific component route.
  • This is most valuable for design-heavy PRs — skip it for backend-only changes.

© spencerpauly, CC0-1.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in resources/screenshotting-changelog of spencerpauly/awesome-cursor-skills.

Open the folder on GitHubat commit 99cd265

Compare with similar skills

Screenshotting Changelog next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Screenshotting Changelog compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Screenshotting Changelog this skillspencerpauly/awesome-cursor-skills844—~617Automated safety check: PassCC0-1.0
StarRocks Release NotesStarRocks/starrocks12k—~1.9kAutomated safety check: NotesApache-2.0
Git Workflow and Versioningaddyosmani/agent-skills105k2 repos~3.5kAutomated safety check: NotesMIT
Changesetbiomejs/biome26k—~839Automated safety check: PassApache-2.0
Verdaccio Pull Request Workflowverdaccio/verdaccio18k—~1.9kAutomated safety check: PassMIT
pybind11 Release Preparationpybind/pybind1118k—~1.7kAutomated safety check: PassCustom licence

Similar skills

  • StarRocks Release Notes

    StarRocks/starrocks

    Drafts English release notes for a StarRocks patch release from the PRs merged into its release branch, then opens a documentation PR and hands translation to /translate.

    12k GitHub stars~1.9k tokensUpdated today
    DevelopmentAuto-check: notes

  • Git Workflow and Versioning

    addyosmani/agent-skills

    Sets git habits for every change: short-lived branches, atomic commits with descriptive messages, clean pull requests, plus versioning, tagging and changelogs for releases.

    105k GitHub starsUsed in 2 repos~3.5k tokens
    DevelopmentAuto-check: notes

  • Changeset

    biomejs/biome

    Official

    A skill your agent uses when a Biome change may affect users and you must decide whether it needs a changeset, choose the release level, or create and edit .changeset/.md release-note text.

    26k GitHub stars~839 tokensUpdated today
    DevelopmentAuto-check passed

  • Verdaccio Pull Request Workflow

    verdaccio/verdaccio

    Takes a change through a verdaccio pull request: branch, local checks, changeset, title and body, labels, CI and review rounds, and ports to other release lines.

    18k GitHub stars~1.9k tokensUpdated 2 days ago
    DevelopmentAuto-check passed

  • pybind11 Release Preparation

    pybind/pybind11

    Opens the pybind11 release-preparation pull request: picking the release base, bumping the version in common.h and integrating the changelog, following docs/release.rst.

    18k GitHub stars~1.7k tokensUpdated 2 days ago
    DevelopmentAuto-check passed

  • AionUi Version Bump

    iOfficeAI/AionUi

    Automates an AionUi release: checks the latest AionCore release and its artifacts, updates package.json, writes the changelog, opens a PR and tags the release.

    33k GitHub stars~2.1k tokensUpdated 1 mo ago
    DevelopmentAuto-check passed

More from spencerpauly/awesome-cursor-skills

All 60 skills in this repo

  • Generating Images

    spencerpauly/awesome-cursor-skills

    Generate or edit images using the OpenAI Image API (gpt-image-2).

    844 GitHub stars~3.7k tokensUpdated 2 mo ago
    Auto-check: notes

  • Babysitting PR

    spencerpauly/awesome-cursor-skills

    Monitor a pull request for CI failures, review comments, and merge conflicts — then fix them automatically.

    844 GitHub stars~930 tokensUpdated 2 mo ago
    Auto-check passed

  • Best Of N Solving

    spencerpauly/awesome-cursor-skills

    Solve a hard problem by trying multiple approaches in parallel using isolated git worktrees.

    844 GitHub stars~698 tokensUpdated 2 mo ago
    Auto-check passed

  • Grinding Until Pass

    spencerpauly/awesome-cursor-skills

    Keep iterating on code changes until the tests pass, the build succeeds, or linting is clean.

    844 GitHub stars~796 tokensUpdated 2 mo ago
    Auto-check passed

  • Parallel CI Triage

    spencerpauly/awesome-cursor-skills

    When GitHub Actions fails, fetch failing job logs and assign each failing job to a separate subagent that fixes its slice of the problem in parallel.

    844 GitHub stars~793 tokensUpdated 2 mo ago
    Auto-check passed

  • Parallel Exploring

    spencerpauly/awesome-cursor-skills

    Explore a large codebase in parallel by launching multiple explore subagents that each investigate a different area simultaneously.

    844 GitHub stars~787 tokensUpdated 2 mo ago
    Auto-check: notes

Categories

Questions about Screenshotting Changelog

What does Screenshotting Changelog do?

Generate a visual changelog or PR description by taking before/after screenshots of UI changes using Cursor's built-in browser. Screenshotting Changelog is an agent skill from spencerpauly/awesome-cursor-skills. Generate a visual changelog or PR description by taking before/after screenshots of UI changes using Cursor's built-in browser.

When should I use Screenshotting Changelog?

Screenshotting Changelog fits situations like: preparing a PR with visual changes; tasks that involve Changelog and release notes; tasks that involve Pull requests.

How do I install Screenshotting Changelog in Claude Code?

Run `npx skills add spencerpauly/awesome-cursor-skills --skill screenshotting-changelog -a claude-code`. Or copy the skill folder (resources/screenshotting-changelog in spencerpauly/awesome-cursor-skills) into .claude/skills/screenshotting-changelog in your project. Claude Code loads it when a task matches its description.

How do I install Screenshotting Changelog in Codex?

Run `npx skills add spencerpauly/awesome-cursor-skills --skill screenshotting-changelog -a codex`. Or copy the skill folder (resources/screenshotting-changelog in spencerpauly/awesome-cursor-skills) into .agents/skills/screenshotting-changelog in your project. Codex loads it when a task matches its description.

Can I use Screenshotting Changelog in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add spencerpauly/awesome-cursor-skills --skill screenshotting-changelog -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/screenshotting-changelog, .gemini/skills/screenshotting-changelog, .github/skills/screenshotting-changelog and .opencode/skills/screenshotting-changelog in your project.

What does Screenshotting Changelog need to run?

Going by SKILL.md and its folder, Screenshotting Changelog needs the command-line tools its instructions call (git).

Does Screenshotting Changelog access the network?

SKILL.md contains no URLs. Its commands use git, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is Screenshotting Changelog safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Screenshotting Changelog use?

Screenshotting Changelog is published under the CC0-1.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Screenshotting Changelog use?

About 617 tokens (SKILL.md is roughly 2.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Screenshotting Changelog?

Skills that share tags, products or a category with Screenshotting Changelog: StarRocks Release Notes (StarRocks/starrocks, 12k stars), Git Workflow and Versioning (addyosmani/agent-skills, 105k stars), Changeset (biomejs/biome, 26k stars) and Verdaccio Pull Request Workflow (verdaccio/verdaccio, 18k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Screenshotting Changelog?

spencerpauly (a GitHub user) maintains it in spencerpauly/awesome-cursor-skills, which has 844 GitHub stars. The repository holds 60 skills in this directory. The repository was last updated on August 2, 2026.

Source: spencerpauly/awesome-cursor-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.