ScreenshotNeo

BlogHow-to

How to Capture a Full-Page Screenshot with Chromium DevTools

Capture an entire webpage in Chromium DevTools, including content below the fold. Learn the exact menu path, alternatives, and how to troubleshoot captures.

By the ScreenshotNeo team4 October 20265 min read

To capture a full-page screenshot in Chromium DevTools, open DevTools, turn on the Device toolbar, open the toolbar’s More options menu, and select Capture a full size screenshot. This captures the page beyond the visible viewport. For only the visible area, choose Capture screenshot from the same menu.

Capture the entire page

  1. Open the page in Chromium and open DevTools. You can use the browser’s DevTools command or menu; exact browser menu labels can vary.
  2. In DevTools, click Toggle device toolbar in the top action bar. This opens Device Mode.
  3. In the Device toolbar, open More options.
  4. Choose Capture a full size screenshot.

DevTools saves the resulting image through the browser’s download flow. The image covers content outside the current viewport, so it is useful for reviewing a long page or sharing its overall layout.

These steps use the built-in Chromium interface; there is no command-line script or additional package to install. The official Chrome for Developers Device Mode guide documents the full-size option and the viewport-only option.

Choose the right capture mode

What you need DevTools option What it captures
The whole page Capture a full size screenshot Content beyond the visible viewport as well as the viewport.
Only what is currently visible Capture screenshot The current viewport.
A selected region Capture area screenshot from the Command Menu A region you select, rather than the whole page.
A device presentation frame Enable Show device frame in Device-specific mode, then capture A screenshot presented with the simulated device frame.

A device frame is optional. Enable Show device frame only when the frame is part of the presentation you need; it is not required for full-page capture.

DevTools’ Command Menu is useful for finding commands. Open it with Ctrl+Shift+P on Windows or Linux, or Cmd+Shift+P on Mac. Search for a command such as Capture area screenshot when you need to select a region.

Area capture is a different workflow from full-page capture, and Chrome documents that it does not work while DevTools is undocked. For a full-page image, use the Device toolbar’s More options menu and select Capture a full size screenshot.

Device Mode and real-device differences

Device Mode simulates a mobile experience from a desktop browser. It is a first-order approximation, not the same as running the page on a physical phone. Use it to inspect a responsive layout or create a convenient capture, but check on an actual device when the behavior depends on device-specific hardware, browser behavior, or other real-device conditions.

The capture is still subject to how the particular page renders. Lazy-loaded content, animations, sticky elements, and page-specific scripts can affect what appears. The official documentation does not guarantee how every site handles these during a full-size capture, so inspect the saved image when those details matter.

Troubleshooting

Problem Likely cause What to do
You only got the visible screen You chose Capture screenshot. Open Device toolbar More options and choose Capture a full size screenshot.
You cannot find the full-size command The Device toolbar may not be enabled. Click Toggle device toolbar in DevTools, then open the toolbar’s More options menu.
The result is a selected rectangle You used Capture area screenshot from the Command Menu. Use the Device toolbar menu for full-page capture instead.
Area capture is unavailable DevTools is undocked; Chrome documents area capture as unavailable in that state. Dock DevTools and retry area capture, or use the Device toolbar’s full-size option if you need the whole page.
Some content appears missing or changes between captures The site may use lazy loading, animation, sticky positioning, or scripts that change page content. Inspect the page and saved image. The available documentation does not establish a universal handling rule for these site-specific behaviors.
The mobile screenshot differs from a phone Device Mode simulates a mobile experience on desktop. Use a real device to confirm behavior when device-specific fidelity matters.

Reliability, performance, and workflow notes

  • Check the output: If a particular below-the-fold section matters, confirm it appears in the downloaded screenshot, especially on pages with dynamic content.
  • Use viewport capture for quick checks: It captures less page content when you only need to review the current screen.
  • Use full-size capture for page review: It includes off-viewport content in one image. Very long pages produce larger images and may be less convenient to inspect or share; the sources do not specify a performance limit or guarantee for page length.
  • Do not treat emulation as device testing: Device Mode is an approximation. Verify on real hardware when that distinction affects the result.
  • Cost: Chromium DevTools is a built-in browser developer tool for this workflow; the documented steps do not require a paid screenshot service.

Or skip the browser setup

For a repeatable capture from code, ScreenshotNeo offers a website screenshot API and MCP server. One GET request takes a URL and returns an image or PDF. See the ScreenshotNeo API documentation for the request options.

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp
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)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await Bun.write('shot.webp', res);
  • Cookie banners, popups, and chat widgets are removed before the shot; each cleanup step can be turned off.
  • Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed. Responses report the page verdict and billing status in headers.
  • An MCP server lets AI agents use screenshot tools, including take_screenshot, get_page_info, and capture_pdf.
  • The free plan includes 1,000 screenshots a month with no card. Paid plans start at $5 for 3,000 screenshots; yearly billing gives two months free, and every feature is on every plan.

Sign up for ScreenshotNeo’s free plan: 1,000 screenshots a month, no card required.

FAQ

Does full-size capture include content below the fold?

Yes. Choose Capture a full size screenshot; the viewport-only Capture screenshot command captures what is visible.

Do I need to turn on a device frame?

No. The frame is an optional presentation choice in Device-specific mode.

Does Device Mode prove how the page behaves on a real phone?

No. It simulates a mobile experience on desktop. Use a real device when device-specific behavior matters.

Can I use the Command Menu shortcut for full-page capture?

The shortcut opens the Command Menu, which is useful for commands such as area capture. The documented full-page procedure is through the Device toolbar’s More options menu.