How to Take a Full-Page Screenshot with Playwright When the Page Is Very Tall

Use Playwright’s full-page screenshot option: set fullPage: true in JavaScript or full_page=True in Python. This captures the full scrollable page rather than only the visible viewport. For very tall pages, consider scale: 'css' to keep the output to one image pixel per CSS pixel, and check whether lazy-loaded content or nested scroll areas need separate handling.

1. Capture a tall page with Playwright

Install Playwright and its browser, then navigate to the page and take a full-page screenshot. These examples save a PNG to disk.

JavaScript

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com', { waitUntil: 'load' });
  await page.screenshot({ path: 'page.png', fullPage: true });
  await browser.close();
})();

TypeScript

import { chromium } from 'playwright';

const browser = await chromium.launch();
const page = await browser.newPage();
await page.goto('https://example.com', { waitUntil: 'load' });
await page.screenshot({ path: 'page.png', fullPage: true });
await browser.close();

Python

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch()
    page = browser.new_page()
    page.goto('https://example.com', wait_until='load')
    page.screenshot(path='page.png', full_page=True)
    browser.close()

Replace https://example.com with the page you need. The official guide describes a full-page screenshot as covering the full scrollable page, as if it were displayed on a screen tall enough to fit it. Playwright’s screenshot guide.

2. Control output dimensions and bytes

A full-page screenshot can be much larger than a viewport image. Playwright’s default screenshot scale is device; on a high-DPI device this can produce a larger image. Set scale: 'css' when you want one output pixel per CSS pixel:

await page.screenshot({
  path: 'page.png',
  fullPage: true,
  scale: 'css'
});

Python uses the same option name with an underscore:

page.screenshot(path='page.png', full_page=True, scale='css')

Use path to write the screenshot to a file. If you omit it, the screenshot API returns image bytes, which you can pass to another library or upload to storage:

const imageBytes = await page.screenshot({ fullPage: true, scale: 'css' });

image_bytes = page.screenshot(full_page=True, scale='css')

Check the API reference for the Playwright version installed in your project for the supported screenshot options, including timeout behavior. Page.screenshot API reference.

3. Make sure tall-page content is present

A full-page capture covers the scrollable page, but that does not guarantee every site has loaded all of its content. In particular, the documentation cited here does not promise that lazy-loaded images will load automatically or that nested scroll containers will be expanded.

Lazy-loaded images and content

If a page loads images or sections only as they approach the viewport, inspect the screenshot for missing content. A site-specific approach is to scroll down in steps before capturing, giving newly visible content time to load. There is no single scroll strategy that works for every page: some applications fetch on scroll, some use intersection observers, and others keep content inside a separately scrolling panel.

const height = await page.locator('body').evaluate(el => el.scrollHeight);
for (let y = 0; y < height; y += 700) {
  await page.evaluate(y => window.scrollTo(0, y), y);
  await page.waitForTimeout(150);
}
await page.evaluate(() => window.scrollTo(0, 0));
await page.screenshot({ path: 'page.png', fullPage: true, scale: 'css' });

The step size and delay are examples to adapt to the target site. If it loads content asynchronously, wait for a page-specific condition such as a selector becoming visible rather than relying on a fixed delay alone. Recheck the final image for gaps, repeated sections, or content that has not appeared.

Nested scroll containers

A page may contain a panel with its own scrollbar. The document’s full-page capture does not mean that every nested panel is automatically scrolled to its end. Identify the relevant container and scroll it before taking the screenshot, or capture that region separately. Verify the output against the page because behavior depends on how the site is built.

4. Troubleshooting

Symptom	Likely cause	What to do
Only the viewport appears	The full-page option is missing or spelled incorrectly.	Use `fullPage: true` in JavaScript/TypeScript or `full_page=True` in Python.
Images or sections are missing lower down	They may load only after scrolling or after an application-specific event.	Scroll through the page first, wait for the relevant content, and inspect the resulting image.
A scrollable panel looks incomplete	The panel has its own scroll area separate from the document.	Scroll the panel itself or capture it separately; verify the page-specific result.
The image is unexpectedly large	The default `device` scale can produce more pixels on high-DPI devices, and the page itself may be very tall.	Try `scale: 'css'` / `scale='css'`, then check that the resolution is sufficient for your use.
Screenshot call times out	The capture may exceed the configured screenshot timeout or encounter a slow/large page.	Consult the Page API for your installed version and adjust the screenshot timeout as appropriate. Also check the page dimensions and loading behavior.
Screenshot fails in a constrained environment	The browser process may not launch or may lack required runtime dependencies.	Confirm Playwright’s browser is installed for that environment and review the launch error; this is separate from the full-page option itself.

5. Performance, reliability, and cost

Taller pages generally require more image data to produce and store. Choose CSS scale when device-pixel detail is unnecessary, save directly to a file when you do not need to manipulate the bytes in memory, and avoid repeatedly capturing a page while debugging layout or readiness conditions. For reliable output, wait for the content your workflow needs and inspect a representative screenshot; page-specific lazy loading and nested scrolling can affect completeness.

Playwright is software you run in your own environment, so account for your browser execution and image storage or transfer needs. The cited Playwright documentation does not provide a topic-specific benchmark or cost figure for very tall screenshots.

6. Or skip the browser setup

If you need a screenshot without managing a browser instance, ScreenshotNeo provides a website screenshot API. Its one-call request can return an image or PDF; the API supports full-page capture and loads lazy images.

See the ScreenshotNeo API documentation for request options. Example cURL request:

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

Python:

import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)

Node.js:

const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);

ScreenshotNeo removes cookie and consent banners, newsletter popups, and chat widgets before capture; each step can be turned off. Bot checks, blank pages, failed loads, timeouts, and cache hits are not billed, and response headers report the page verdict and billing status. Its MCP server lets AI agents use screenshot, page-info, and PDF tools. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000 shots.

7. FAQ

Does a full-page screenshot mean one image pixel per CSS pixel?

Not by default. The default device scale can produce a larger image on high-DPI devices. Choose CSS scale for one pixel per CSS pixel.

Can I process the screenshot without saving a file first?

Yes. Omit path and use the image bytes returned by the screenshot call.

Will full-page mode capture everything in an infinite-scroll feed?

Do not assume so. Infinite-scroll pages may load more content only as you scroll, so scroll and wait for the content you need, then verify the captured result.