full-page-screenshot
Use when the user asks to capture a full-page screenshot, long screenshot, or complete page capture of a web page. Handles SPA scroll containers, lazy-loaded images, and very tall pages via Chrome DevTools Protocol with zero external dependencies.
Best for Documentation teamsWorks with GitHubLow risk
⌘source
- author
@alirezarezvani- language
- Python
★13kstars
1.7kforks
Apr 29, 2026
✦overview.md
Key Features
- ·Captures entire scrollable page
- ·Handles SPAs and lazy images
- ·Zero external dependencies
- ·PNG output via Chrome DevTools Protocol
Use Cases
- →Capture a full-page screenshot of a web app for documentation
- →Take a long screenshot of a blog post or article
- →Verify visual layout of a page with dynamic content
Best for
- ✓Documentation teams
- ✓QA engineers
- ✓Web developers
Not ideal for
- !One-off screenshots without Chrome setup
FAQs
name
full-page-screenshot
description
Use when the user asks to capture a full-page screenshot, long screenshot, or complete page capture of a web page. Handles SPA scroll containers, lazy-loaded images, and very tall pages via Chrome DevTools Protocol with zero external dependencies.
Full Page Screenshot
Capture a full-page screenshot of any web page via Chrome DevTools Protocol. Produces a single PNG that includes all content — even portions that require scrolling. Zero external dependencies beyond Node.js 22+ and Chrome with remote debugging enabled.
Prerequisites
- Node.js 22+ (uses built-in
WebSocket) - Chrome/Chromium with remote debugging enabled
Check environment readiness:
node "${SKILL_DIR}/scripts/full-page-screenshot.mjs" --check
If Chrome check fails, instruct user to open chrome://inspect/#remote-debugging and enable "Allow remote debugging for this browser instance".
Workflow
Option A: Screenshot an already-open tab (recommended for authenticated pages)
- List available tabs:
node "${SKILL_DIR}/scripts/full-page-screenshot.mjs" --list
- Identify the target by title/URL, then capture:
node "${SKILL_DIR}/scripts/full-page-screenshot.mjs" <targetId> /tmp/screenshot.png --width 1200 --dpr 1
Option B: Screenshot a URL (opens a background tab, captures, closes)
$install
1-click copynpx skills add alirezarezvani/claude-skills --skill full-page-screenshotSafety assessment
★
Clarity score
How clear and easy to understand the SKILL.md instructions are, rated from 1 to 5.
4/ 5
very goodClear and well structured, with only minor parts that might need a second read.
◎
Actionability score
How directly an agent can act on the SKILL.md instructions, rated from 1 to 5.
4/ 5
highMostly actionable with clear steps; only a few small gaps remain.