Guide
How to capture a full page with Chrome DevTools
In Chrome DevTools, open the command menu, type screenshot and select Capture full size screenshot. Chrome saves a PNG of the rendered page beyond the viewport. The command does not promise to load every delayed image or expand hidden panels.
Find the full-size command
The illustrated path was exercised in Chrome 154 through its actual DevTools menu and controls in an isolated headless profile. Pointer and text input were automated, and the final PNG came from Chrome’s completed download. These menu images are crops of the separate DevTools surface, not a combined browser-window screenshot.
- Prepare the page and open DevTools
Load the content and return to the top. Open DevTools from Chrome’s menu, or use Command+Option+I on macOS and Ctrl+Shift+I on Windows or Linux.
- Open Run command
In DevTools, open the three-dot Customize and control DevTools menu and choose Run command. The documented keyboard alternative is Command+Shift+P on macOS or Ctrl+Shift+P on Windows or Linux, with focus inside DevTools.
- Choose Capture full size screenshot
Type screenshot into the command input, then choose Capture full size screenshot. Capture area, node and viewport commands produce different results.
- Review the downloaded PNG
Open the saved file and check the top, final marker, images and panel rows. Chrome saves the native output directly; converting it cannot restore content missing from that image.
Full size, area, node and viewport are different
Use full size for the outer document and an area capture for a chosen rectangle. A node screenshot targets a selected element. A normal viewport capture only includes the current view.
A node screenshot is not a general solution for virtualized tables or clipped descendants. The application still decides which records and images are rendered.
What the browser actually captures
DevTools requests a browser screenshot beyond the viewport. It does not run Captorify’s sequence of scrolling, visible-tab captures and stitched tiles. That distinction matters when diagnosing fixed headers and delayed content.
The result represents the rendered state at capture time. A full-size request cannot guarantee that every below-the-fold resource has loaded.
Architecture reference: Inspect the upstream DevTools capture implementation
Load missing images before capturing
In our actual Chrome 154 command-menu run, both native PNGs were 725 × 7669 pixels. The first capture reached the final marker but omitted the delayed image. Scrolling down with the mouse wheel, waiting for the image and returning to the top made it appear in the second native download.
The browser window was 1280 × 1000. Right-docked DevTools reduced the actual page viewport to 725 × 913 at DPR 1, without device emulation. That narrower viewport changed the page layout. Both outputs still show only the visible rows of the inner scrolling panel and embedded document.
Download the actual DevTools native PNG
Check scrolling panels and the bottom of very tall pages
In a Chrome 153 test using the DevTools Protocol screenshot API, only four rows of a 12-row scrolling panel appeared. Expanding the panel before capture exposed row 12.
A separate 40,000-pixel-tall capture repeated earlier rows and missed row 400 despite having the expected dimensions. Check the actual content at the bottom of a tall image. These are separate protocol tests, not the October 12 command-menu run. The current native UI run did not test the 40,000-pixel fixture.
Inspect the tall protocol output
Related guide for this task Check a screenshot against a test page
Troubleshoot the saved image
Convert or redact after capturing
The built-in screenshot output is a PNG. You can redact private fields with the free screenshot redactor or convert the image to a multi-page PDF without installing an extension.
Choose Captorify’s extension if you want repeated capture with PNG, JPG and PDF export. Check the saved result regardless of the method.