capture-pr-visuals

Installation
SKILL.md

Capture screenshots and GIFs of the running application for PR visual documentation. Reads chalk.json for dev server and route info, falls back to auto-discovery if chalk docs don't exist. Uses Playwright via npx.

Workflow

Step 1: Read Project Context

Read .chalk/chalk.json to get:

  • dev.command — how to start the dev server
  • dev.port — what port it runs on
  • dev.url — the full URL
  • routes[] — what pages to capture
  • project.framework — for framework-specific handling (e.g., Electron)

Fallback: No chalk.json

If chalk.json doesn't exist or is missing key fields, auto-discover:

  1. Read package.json — detect framework from dependencies:
    • next → Next.js (port 3000, file-based routing)
Related skills
Installs
5
GitHub Stars
6
First Seen
Mar 18, 2026