How to take a scrolling screenshot in Chrome

A scrolling screenshot — also called a full-page or long screenshot — captures a whole webpage rather than just the part visible in your window. Chrome can do it two ways.

The built-in way

1. Open DevTools: F12, or Cmd+Option+I on macOS.
2. Press Ctrl+Shift+P (Cmd+Shift+P on macOS) to open the command menu.
3. Type screenshot.
4. Choose Capture full size screenshot.

The file lands in your downloads folder. No extension, no account, and it is genuinely the right answer if you need this once.

The extension way

An extension automates scrolling and stitching, and handles the awkward cases the built-in command does not. It is worth installing one if you take these regularly, need to annotate the result, or work on sites with lazy loading.

Why scrolling screenshots go wrong

The header repeats down the image

A position: fixed navigation bar stays pinned to the viewport, so every frame the tool captures contains it. The fix is to keep it for the first screen and hide it for the rest. If your tool has a “hide fixed elements” setting, this is what it does.

Images are missing or grey

Most modern sites lazy-load images: they only start downloading when they scroll near the viewport. If the capture moves faster than the network, you photograph the placeholder.

The reliable fix is to scroll to the bottom of the page yourself first, wait for everything to load, scroll back to the top, then capture. Some tools do this pre-scroll for you — in FullPageSS it is the “Maximum Compatibility” capture speed.

There is a visible seam, or content repeats

This is a stitching bug. You cannot scroll past the bottom of a page, so the final screen overlaps the one before it. A tool that assumes each frame sits exactly one viewport below the last will paste that final frame too low and duplicate a band of the page.

The image is blurry or scaled down

Browsers refuse to create images beyond roughly 32,767 pixels per side, and on a high-DPI screen each CSS pixel becomes two device pixels — so a 20,000-pixel-tall page is already 40,000 pixels of image. Past that ceiling something has to give, and scaling down is the only sensible answer.

What about a mobile-sized screenshot?

Resize your browser window before capturing, or use DevTools device emulation to set a phone viewport and then capture. The page reflows to that width, and the screenshot matches what a phone user sees.

If you take these often

FullPageSS handles the four problems above by default: sticky headers suppressed after the first screen, a pre-scroll option for lazy images, frames placed where the page actually landed, and an honest notice when a page is too tall for full resolution. See what it does or the free plan.