Full Page Website Screenshot: 4 Methods Compared

Profile

Written By Hanzala Saleem

Updated At July 24, 2026 | 6 min read

You hit the screenshot shortcut, and the image cuts off halfway down the page. The footer, the pricing table, the testimonials section below the fold, all gone. It's one of the most common annoyances in web work, and it happens because a standard screenshot only captures what's inside the browser's visible viewport, not the full scrollable page.

A full page screenshot solves that by capturing the entire page, top to bottom, as one continuous image. This guide covers four ways to do it: a built-in browser tool, a browser extension, writing your own automation script, and calling a screenshot API. Each has a different tradeoff between speed, control, and how much infrastructure you want to maintain.

What "Full Page" Actually Means

A viewport screenshot captures only what's visible on screen at that moment, similar to a phone's screenshot button. A full page (or "full-size") screenshot captures the entire rendered height of the page, including everything a visitor would only see by scrolling.

This matters for anything longer than a single screen: landing pages, blog posts, product pages, documentation, and pricing pages almost always extend well past the fold. Tools that only capture the visible viewport will silently drop that content unless you explicitly ask for a full page render.

The tricky part isn't the concept, it's the execution. Long pages often load additional content as you scroll (lazy-loaded images, infinite scroll feeds, animated sections), and a screenshot tool has to actually simulate scrolling through the page before it captures anything, or those sections come out blank.

Method 1: Browser DevTools (Free, No Install)

Chromium-based browsers, including Chrome and Edge, ship with a full-size screenshot option built into DevTools.

  1. Open the page you want to capture.
  2. Open DevTools (F12 or Cmd+Option+I on Mac).
  3. Open the Command Menu (Cmd+Shift+P or Ctrl+Shift+P).
  4. Type "screenshot" and select Capture full size screenshot.

This works well for a one-off capture and needs nothing installed. The limitations show up quickly once you need more than a single screenshot: there's no automation, no scheduling, no way to strip cookie banners or ads first, and pages with lazy-loaded sections sometimes render blank because DevTools doesn't always wait for every asset to finish loading before it scrolls through.

Method 2: Browser Extensions

Extensions like GoFullPage or Fireshot add a toolbar button that captures the full page in one click, often with basic annotation or PDF export built in.

They're a step up from DevTools for non-developers: no keyboard shortcuts, a visible button, and sometimes a built-in editor for adding arrows or highlights before saving. They still share DevTools' core limitation, though. Extensions run inside your browser, tied to your session, so there's no way to batch a list of URLs, run captures on a schedule, or trigger one from a script or webhook.

If you only ever need an occasional screenshot for a doc or a Slack message, this is often the fastest option. If you need repeatable, automated, or bulk captures, neither DevTools nor extensions get you there.

Method 3: Write Your Own Script (Puppeteer or Playwright)

For anything programmatic, developers typically reach for Puppeteer or Playwright, both of which drive a real Chromium browser and support a fullPage: true option.

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({
    headless: 'new',
    args: ['--no-sandbox', '--disable-setuid-sandbox'],
  });
  const page = await browser.newPage();
  await page.setViewport({ width: 1280, height: 800 });
  await page.goto('https://example.com', { waitUntil: 'networkidle0' });
  await page.screenshot({ path: 'full-page.png', fullPage: true });
  await browser.close();
})();

This gives you full control over the browser: custom headers, cookie injection, ad blocking rules you write yourself, and scroll logic you tune per site. That control comes with real maintenance overhead. Each headless Chrome instance takes roughly 300 to 500 MB of RAM, browser versions drift and need patching, and lazy-loaded or infinite-scroll pages need custom scroll-and-wait logic or they render with blank gaps. Scaling this past a handful of concurrent requests usually means building out a queue, a worker pool, and autoscaling infrastructure on top of the script itself.

If you want the deeper walkthrough on tuning Puppeteer for full page captures, including handling cut-off screenshots and slow-loading sections, see how to take a full page screenshot in Playwright and the complete guide to website screenshots with Playwright.

Method 4: A Screenshot API

The fourth option skips the browser management entirely. A screenshot API runs the Chromium instance on its own infrastructure; you send a URL, it sends back an image.

With ScreenshotAPI, a full page capture is one request with full_page=true:

curl "https://shot.screenshotapi.net/v3/screenshot?token=TOKEN&url=https%3A%2F%2Fexample.com&full_page=true&output=image&file_type=png"
const axios = require("axios");

const response = await axios.get("https://shot.screenshotapi.net/v3/screenshot", {
  params: {
    token: "YOUR_API_KEY",
    url: "https://example.com",
    full_page: true,
    output: "image",
    file_type: "png",
    block_ads: true,
    no_cookie_banners: true,
  },
  responseType: "arraybuffer",
});
import requests

params = {
    "token": "YOUR_API_KEY",
    "url": "https://example.com",
    "full_page": "true",
    "output": "image",
    "file_type": "png",
    "block_ads": "true",
    "no_cookie_banners": "true",
}

response = requests.get("https://shot.screenshotapi.net/v3/screenshot", params=params)
with open("full-page.png", "wb") as f:
    f.write(response.content)

full_page=true tells the API to scroll through the entire page internally and stitch the result into one image, including content below the fold. Pair it with block_ads=true and no_cookie_banners=true to strip ads and consent pop-ups before the capture, so you don't have to crop them out afterward. Add output=pdf instead of output=image and the same request returns a PDF rather than a PNG. Full parameter reference is in the viewport and full page screenshot docs.

The tradeoff is the mirror image of Method 3: less low-level control over the browser process itself, in exchange for zero infrastructure to run or patch, built-in ad and cookie-banner blocking, and the ability to scale from one request to thousands without touching a queue or a Kubernetes config. See the full getting started guide or grab a key and try it on the URL to screenshot tool.

Comparing the Four Methods

MethodSetup TimeAutomationAd/Cookie BlockingBest For
DevToolsNoneNoNoOne-off capture
Browser Extension1 click installNoPartialOccasional, non-dev use
Puppeteer / PlaywrightHoursFull (self-built)Manual rulesTeams needing full browser control
Screenshot APIMinutesFull (built-in)Built-inAutomated, scaled, or bulk captures

API vs. Self-Hosted Puppeteer

Since Methods 3 and 4 both run a real Chromium browser, the real decision for developers usually comes down to these two. Here's where the cost actually lands once you're past a proof of concept:

CriteriaSelf-Hosted PuppeteerScreenshot API
Infrastructure costServers + DevOps timeIncluded in the plan
Setup timeDays to weeksUnder 5 minutes
ScalingManual queues, autoscalingAutomatic
Chrome version drift / CVEsYour responsibilityHandled for you
Lazy-load / infinite scroll handlingCustom logic per siteBuilt-in
Ad & cookie-banner removalCustom rule list20,000+ rules built-in

Neither is objectively "better." A small script for a single internal tool is fine self-hosted. A production feature that screenshots hundreds of URLs a day, or runs on a schedule, tends to get expensive fast in engineering time once you factor in memory leaks and Chrome crashes under load.

Why Full Page Screenshots Get Cut Off (and How to Fix It)

Three causes account for most cut-off or blank full page screenshots:

Lazy-loaded images and sections. If a tool captures the page before it finishes scrolling and triggering lazy-load, you get blank gaps where images should be. Fix: use a tool that scrolls through the page first, or add a delay/wait-for-selector step before capture. ScreenshotAPI's lazy_load=true and delay parameters handle this automatically.

Infinite scroll pages. Pages that load new content indefinitely (social feeds, some e-commerce category pages) don't have a natural "bottom," so a full page capture has to stop somewhere. Most tools cap this at a reasonable scroll depth rather than trying to capture an unbounded page.

Fixed or sticky elements. Sticky headers and floating chat widgets can appear duplicated at multiple points in a stitched full page image. Blocking chat widgets before capture, or removing the selector, avoids this.

Viewport vs Full page Screenshot

Get Started

Full page screenshots matter most the moment you need more than one of them, for documentation, monitoring, or reporting. If DevTools or an extension is starting to feel like a bottleneck, try ScreenshotAPI free with 100 screenshots and no credit card required, or compare it against other approaches in the best ways to take full page screenshots effortlessly.

Frequently Asked Questions

What is the fastest way to take a full page screenshot?

For a single page, Chrome DevTools' "Capture full size screenshot" command is fastest since it needs no install. For repeated or automated captures, a screenshot API is faster in practice because it removes browser setup and scroll-handling entirely.

Why does my full page screenshot cut off part of the page?

This usually happens because the tool captured before lazy-loaded content finished rendering, or the page has an unbounded infinite scroll. Adding a short delay, or using a tool with built-in lazy-load handling, resolves most cases.

Can I take a full page screenshot without installing anything?

Yes. Chrome and Edge DevTools include a built-in full page screenshot command, and a screenshot API needs no browser or extension installed locally since the capture runs on the API's servers.

How do I automate full page screenshots for many URLs?

Puppeteer or Playwright scripts can loop over a list of URLs, or a screenshot API's bulk endpoint can accept a CSV or JSON list and process them without you managing browser instances yourself.