A full page website screenshot captures your entire web page — header to footer — in a single tall image, no stitching or scrolling required. The fastest free way is Chrome’s built-in developer tools: open DevTools (F12), press Ctrl+Shift+P, type “Capture full size screenshot,” and Chrome saves the whole page as a PNG. Firefox and Safari have the same trick built in, and free extensions cover everything else.
I learned the value of this the hard way. A client once emailed me a complaint: “the bottom of the homepage looks broken on my laptop.” They attached a screenshot of the footer area — cropped, of course. I had no idea what the rest of the page looked like on their screen, and my own screenshots only showed one viewport at a time. A single full page website screenshot would have shown me the entire page in one glance: the hero, the sections, the spacing, and the footer — all in context. That’s what this tool is for. Not a photo of a screen. A complete record of a page.
What is a full page website screenshot, exactly?
A normal screenshot captures only what’s visible in your browser window — one screenful, maybe 800 pixels tall. A full page website screenshot captures the entire scrollable length of the page, even the parts below the fold. The result is one tall PNG, sometimes 5,000 pixels high or more, showing every section in order.
This is different from two things people often confuse it with. First, it’s not a screen recording — it’s a still image. Second, it’s not a stitched screenshot: good tools render the page in one pass, so there are no seams, duplicated sticky headers, or mismatched fonts where the images were glued together. Stitched captures break exactly where they matter most — on pages with sticky navigation, lazy-loaded images, or parallax sections.
You need a full page capture whenever the whole page matters more than one screenful: design reviews, bug reports, before-and-after redesign comparisons, archiving a page before a redesign, or sending a client proof of what a page actually looks like.
How do I take a full page screenshot in Chrome?
Chrome has the best built-in option, and most people never find it because it’s buried in DevTools. No extension needed.
1. Open the page you want to capture.
2. Press F12 (or Ctrl+Shift+I on Windows, Cmd+Option+I on Mac) to open DevTools.
3. Press Ctrl+Shift+P (Cmd+Shift+P on Mac) to open the command palette.
4. Type “screenshot” and choose Capture full size screenshot.
5. Chrome saves a PNG of the entire page to your Downloads folder.
Two details make the difference between a clean capture and a mess. First, set the device toolbar off — if you’re emulating a phone, Chrome captures at the emulated size, which is exactly what you want for a mobile full page screenshot, but don’t leave it half-configured. Second, watch out for sticky headers: Chrome’s capture renders the page as one long image, and a sticky header can repeat down the length of the capture on some sites. If yours does, hide the header with a quick CSS override in DevTools (right-click the header, Inspect, then add display: none in the Styles panel) before capturing.
For a repeatable workflow, try the free GoFullPage extension instead. One click on the toolbar icon captures the page and opens a preview where you can crop, annotate, and download as PNG, JPG, or PDF. It’s the tool I hand to non-technical clients — no DevTools, no keyboard shortcuts, just a button.
How do I take a full page screenshot in Firefox?
Firefox’s built-in tool is the easiest of all the browsers — and it’s been there for years, hiding in plain sight.
1. Right-click anywhere on the page (not on an image or link) and choose Take Screenshot.
2. In the screenshot toolbar, click Save full page.
3. Firefox shows a preview; click Download to save the PNG, or Copy to paste it straight into a document or chat.
Firefox’s capture is unusually clean with sticky elements and lazy-loaded images, because it scrolls the real page and renders each section in place. One quirk: on very long pages with infinite scroll, Firefox captures only what’s loaded — scroll to the bottom first so lazy content is in the page before you capture. The same advice applies to every method on this list: a full page screenshot can only capture what the browser has actually rendered.
If you want more control, the free Fireshot extension adds capture-to-PDF, annotations, and one-click uploads. For most people, though, the built-in tool is enough.
What about Safari, Edge, and mobile?
Safari’s built-in capture is a little different from Chrome’s, but it works well once you know where it lives.
1. In Safari, take a screenshot as usual (Cmd+Shift+4, then Space, then click the window — or use the Screenshot app).
2. In the preview thumbnail, click Full Page at the top instead of Screen.
3. Save as PDF. Safari’s full page capture saves as a PDF, not a PNG — which is actually handy for long pages, since PDFs stay sharp at any zoom and print cleanly. Convert to PNG with Preview (File → Export) if you need an image file.
Edge users get Chrome’s method for free, since Edge is built on Chromium: F12, Ctrl+Shift+P, “Capture full size screenshot.” Same steps, same result.
On mobile, the options are thinner but real. On iPhone, take a screenshot, tap the thumbnail, and choose Full Page — Safari saves the whole page as a PDF. On Android, the built-in scrolling screenshot (available on most recent Samsung and Pixel phones) captures a few extra screens, but for a true full page capture, use a free app like LongShot or capture the page in your desktop browser instead — the desktop result is almost always cleaner.
How do I screenshot a page I can’t open in my own browser?
Sometimes the page you need to capture isn’t yours to open — a staging site behind a login, a client’s site on a test server, or a page that only renders correctly on someone else’s machine. Three free approaches cover this.
First, the free online capture tools: paste a URL into a service like Screenshot Guru or a similar free web-capture tool, and you get a full page website screenshot without installing anything. Quality varies, and never use these for pages behind a login — you’d be handing the URL to a third party.
Second, the command line. If you’re comfortable with a terminal, headless Chrome does this in one command: chrome --headless --screenshot --window-size=1280,5000 https://example.com. Adjust the window height to roughly match the page length. Puppeteer and Playwright wrap the same engine with proper full-page flags (fullPage: true) and handle lazy loading and waiting for fonts — the route I use for automated before-and-after captures.
Third, and most useful for a design review: capture your own page at multiple widths and compare them side by side. A full page screenshot at 1440px, one at 768px, and one at 390px tells you more about a responsive layout than any single viewport ever will. Try it on your own site with our responsive preview tool — open the page, check the layout at each size, and capture the widths where things break.
What ruins most full page screenshots?
Four mistakes, and they’re all avoidable.
– Sticky headers repeating. As mentioned above, some capture tools re-render a fixed header at every “page” of the capture. Hide fixed elements before capturing, or use Firefox’s built-in tool, which handles them best.
– Lazy-loaded images showing as grey boxes. Scroll to the bottom of the page first, wait a few seconds for images to load, then capture. The same goes for animations that only trigger on scroll — trigger them before you capture.
– Cookie banners and popups. Dismiss them before capturing, or they appear in the middle of your clean screenshot. For repeat captures of your own site, use a browser profile with consent already saved.
– Huge file sizes. A 10,000-pixel-tall PNG can be several megabytes. If you’re sending it in an email or a bug report, compress it first (Squoosh, TinyPNG, or the free image tools built into most operating systems) or export as JPG for photographic content. Keep the original PNG for your records.
Frequently asked questions
Can I take a full page screenshot without installing anything?
Yes. Chrome’s DevTools capture (F12 → Ctrl+Shift+P → “Capture full size screenshot”) and Firefox’s built-in screenshot tool both work with zero extensions. Safari on Mac and iPhone saves full page captures as PDFs, also with nothing to install.
Why does my full page screenshot have a repeated header?
Your site uses a sticky or fixed header, and the capture tool re-rendered it at each scroll position. Hide the header element before capturing, or use Firefox’s built-in tool, which handles sticky elements more cleanly.
What’s the best free tool for full page screenshots?
For one-off captures, your browser’s built-in tool — Chrome DevTools or Firefox’s screenshot button — is the best free option because there’s nothing to install and nothing to trust with your data. For frequent captures with annotation, GoFullPage (Chrome) or Fireshot (Firefox) are the free extensions I recommend.
How do I screenshot a very long page?
Scroll to the bottom first so lazy-loaded images and animations render, dismiss any popups, then capture with Chrome DevTools or Firefox. If the file is enormous, export as JPG or compress the PNG before sharing — a 10,000px tall PNG can run to several megabytes.