How to Screenshot an Entire Webpage in Chrome
Four ways to capture a whole page top to bottom, including the one already built into Chrome that most people never find. What each is good at, and where each one breaks.
·8 min read
Chrome’s own screenshot shortcut does not exist, and the operating system ones only photograph what is on screen. To get the whole page — top to bottom, in one file — you need one of four methods.
Chrome can already do this without installing anything. That method is first, in full, because for a lot of jobs it is the right answer.
1. The command already in Chrome
Buried in the developer tools is a command that renders the entire scrolling page to a PNG. No extension, no account, no upload.
- Open the page, and press F12 — or Ctrl with Shift and I, or Cmd with Option and I on a Mac
- Press Ctrl with Shift and P (Cmd with Shift and P on a Mac). A search box appears at the top of the developer tools
- Type capture full size
- Press Enter on Capture full size screenshot
The PNG lands in your downloads folder. Close the developer tools with F12.
What it is good at: it is free, it is already there, it makes no network requests, and on a well-behaved page the output is exact.
Where it falls down: there is nothing to mark it up with and no PDF option. It gives no warning on a page too long to fit, so a very long page can arrive truncated with nothing to tell you. Lazily-loaded images that never scrolled into view can come out blank. And four keystrokes through a developer panel is a lot of ceremony for something you do ten times a day.
2. Print the page to PDF
Press Ctrl or Cmd and P, then set the destination to Save as PDF.
This is not a screenshot, and that is both the advantage and the problem. The browser re-lays out the page for paper: text stays selectable, links usually survive, there is no height limit, and the file is small. Sites with a good print stylesheet produce something cleaner than a screenshot ever would.
But a print layout is a different layout. Navigation disappears, columns reflow, background colors are dropped by default, and elements pinned to the window are usually removed. If what you need is a record of what the page looked like, this is the wrong tool. If what you need is the content, it is usually the right one.
3. Capture in sections and stack them
Take an ordinary screenshot, scroll by slightly less than one screen, take another, repeat. Then stack them in any image editor.
Nobody chooses this method for fun, but it is the only one that works on pages that defeat everything else — anything that loads rows as you scroll and discards the ones you have passed, which is how long chat transcripts and social feeds are built. Scroll-and-stitch tools cannot capture what the page has already thrown away.
Overlap each shot slightly, or the joins will be obvious.
4. An extension
A capture extension does what method one does, with the parts that method one leaves out: a preview before you save, somewhere to draw on the result, PDF as well as PNG, and a way to handle the awkward cases instead of failing silently.
The trade is that you are installing something into the browser you do your banking in. The single most useful habit here is reading the install prompt. Most screenshot extensions ask to read and change all your data on all websites, which is a very large permission for taking a picture — and it is not required to do the job. There is a guide to reading that prompt, and checking any extension you already have.
Which one to use
- Once, and you just need the file: the command in Chrome. Method one.
- You need the text, not the look: print to PDF. Method two.
- A feed or a long chat: sections, stacked. Method three. Nothing else works.
- Regularly, and someone else has to read it: an extension, so you can mark up what you are pointing at before you send it.
When the result looks wrong
Three things account for most bad captures, and each has a mechanical explanation:
- The bottom is missing — a height ceiling counted in device pixels, which a sharp screen reaches sooner
- The header repeats down the image — anything pinned to the window lands in every screen
- The cookie banner is in every frame — the same mechanism, plus it covers content and sometimes blocks scrolling
Something out of date or wrong here? Device specs and interface details shift with every release. Tell me and I'll fix it.
Related reading
- How to Take a Long ScreenshotA long screenshot is one image taller than your screen. Phones and browsers each do it differently, and some of them do not do it at all. Here is the method for each, and what to do when there isn't one.
- Why Your Full-Page Screenshot Is Cut Off at the BottomThe same page captures fine on a desktop and loses its last third on a laptop. The reason is a height limit counted in device pixels, which means a sharper screen runs out sooner.
- Why the Header Repeats Down Your ScreenshotThe menu bar that follows you down the page turns up once per screen in a stitched screenshot. Here is the mechanism, how to recognize it, and what stops it.