← ClaudeAtlas

capture-screenslisted

Automatically navigates a web app using Playwright MCP and captures context-aware named screenshots at each product feature state. Names each file semantically based on context (e.g., checkout-payment-form-filled.png). Outputs a manifest.json mapping filenames to descriptions and a summary report. Use when documenting product features, generating demo screenshots, building user guides, or creating visual test assets for any web application. Composable primitive — other skills (user-guide, demo-docs) consume its manifest.json output.
mostafa-drz/claude-skills · ★ 2 · Data & Documents · score 72
Install: claude install-skill mostafa-drz/claude-skills
## Preferences _On startup, use Read to load `~/.claude/skills/capture-screens/preferences.md`. If missing, use defaults below._ Defaults: - `url`: `http://localhost:3000` - `output`: `screenshots` - `viewport`: `1440x900` - `highlight`: true - `highlight-color`: `#FF4B4B` - `wait-ms`: `800` ## Context _On startup, use Bash to detect the current working directory. Use this for default output path resolution._ ## Command routing Check `$ARGUMENTS`: - `help` → show help, stop - `config` → run config flow, stop - `reset` → delete preferences file, confirm, stop - anything else → run the skill ## Help ``` capture-screens — Automated contextual screenshot capture via Playwright Usage: /capture-screens [context] Interactive — prompts for missing inputs /capture-screens [context] --url <url> App URL to capture /capture-screens [context] --features <f1,f2,...> Comma-separated routes or feature names /capture-screens [context] --output <dir> Output directory (default: screenshots/) /capture-screens [context] --no-highlight Skip CSS highlight injection /capture-screens [context] --viewport <WxH> Viewport size (default: 1440x900) /capture-screens [context] --auth <instructions> How to authenticate, e.g. "login as admin@example.com / pass123" /capture-screens [context] --inject-js <file> Path to a JS file to evaluate before capturing (e.g. to seed state) /capture-screens config