skills.rest
baasith6
baasith6COMMUNITY
Explore all skills by this author →
GitHub

screenshotting-changelog

Capture before and after UI screenshots and integrate them into Markdown PR descriptions.

Updated Apr 23, 2026
Search Tags:#Pull Request#PR visualization#changelog generation#UI comparison#before-after screenshots
One-click install
npx skills add https://github.com/baasith6/cursor-skills --skill screenshotting-changelog-baasith6
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: screenshotting-changelog
Source: https://github.com/baasith6/cursor-skills/tree/main/resources/screenshotting-changelog
Command: npx skills add https://github.com/baasith6/cursor-skills --skill screenshotting-changelog-baasith6

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and assets (resource) components.

What problem does it solve?

This Skill helps automate the generation of visual changelogs for pull requests, allowing you to provide clear, visual proof of UI changes.

Core Features & Use Cases

  • Before/After Screenshot Comparison: Automatically take before and after screenshots of UI changes for preparing PRs.
  • Integration with Dev Server: Works seamlessly with the dev server to capture screenshots after changes.
  • Markdown Integration: Converts screenshots into Markdown-ready content for easy PR description inclusion.
  • Responsive and Dark Mode: Support for taking screenshots in different views like mobile, tablet, and desktop, as well as dark mode.

Quick Start

Activate the screenshotting-changelog skill and provide the branch URLs for before and after states.

Frequently Asked Questions about screenshotting-changelog

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

FAQPage Schema
How do I add before and after screenshots to a pull request description?▼

To add before and after screenshots to a pull request, you can use a visual changelog generator to capture UI states and format them directly into Markdown for PR descriptions.

Can I capture UI comparison screenshots in mobile and dark mode views?▼

Yes, UI comparison screenshots support capturing different views including mobile, tablet, and desktop, as well as dark mode for accurate visual changelogs.

What is the best way to automate visual changelog generation for UI changes?▼

Automating visual changelog generation involves taking before and after screenshots of UI changes and converting them into Markdown-ready content for PR descriptions.

Do I need a local development environment to generate PR screenshots?▼

Yes, generating PR screenshots requires a local development environment with the skill activated to capture before and after UI states from the dev server.

How do I integrate before and after UI screenshots into Markdown?▼

Before and after UI screenshots are converted into Markdown-ready content, allowing you to easily integrate visual comparisons directly into your PR descriptions.

Why use visual changelogs instead of text descriptions for pull requests?▼

Visual changelogs provide clear, visual proof of UI changes by comparing before and after screenshots, which is more effective than text descriptions for PR reviews.

Related Skills

Explore More Software Engineering Skills→
Yahia89Yahia89

before-and-after

Capture paired before-and-after screenshots from two URLs or image paths.

Community
Intermediate
usepowershellusepowershell
9

pr-screenshots

Capture Playwright screenshots and embed them into GitHub pull request descriptions.

Community
Intermediate
kobogithubkobogithub

uiux-viewport-testing

Automate responsive design testing by resizing browser viewports and capturing screenshots.

Community
Intermediate
fcsonlinefcsonline
49

ui-screenshots

Coordinate before/after UI screenshot capture, annotation, and embedding for PRs.

Community
Intermediate