How to Capture a Full Web Page Screenshot in Chrome on Mac

To capture an entire webpage in Chrome on a Mac, open DevTools, switch to Device mode, then choose More options → Capture a full size screenshot. Chrome saves an image containing content above and below the visible viewport.

This method uses Chrome’s built-in tools and does not require an extension.

Capture a full web page in Chrome on Mac

Open the webpage you want to capture in Chrome.
Open DevTools with Command + Option + I. You can also open the Chrome menu and choose More Tools → Developer Tools. See the Chrome DevTools opening guide.
Click Toggle device toolbar in the DevTools action bar. This switches DevTools into Device mode.
In the device toolbar, open More options (the three-dot menu).
Select Capture a full size screenshot.
Choose a location and save the resulting PNG.

Chrome’s Device mode documentation describes this command as capturing the whole page, including content that is not visible in the viewport. Device mode simulates a mobile viewport on your computer; it does not run the page on a physical phone.

Choose the right screenshot command

Command	What it captures	Where to find it
Capture a full size screenshot	The complete page from the top to the bottom, including content outside the viewport.	Device toolbar → More options
Capture screenshot	Only the currently visible viewport.	Device toolbar → More options
Capture area screenshot	A rectangle you select by dragging over the page.	Command Menu

For a custom region, press Command + Shift + P, type screenshot, and choose Capture area screenshot. Chrome notes that area capture does not work when DevTools is undocked. The Command Menu guide documents this workflow.

Set the page size before capturing

The screenshot uses the dimensions currently configured in Device mode. Before capturing, choose a device preset or enter a custom width and height in the device toolbar.

Desktop layout: use a wide custom viewport such as 1440 pixels.
Mobile layout: choose a phone preset or enter the target mobile width.
Retina-like output: adjust the device pixel ratio control when it is available in the toolbar.

Changing the viewport can trigger responsive breakpoints, different navigation, lazy loading, and different advertisements. Capture again after changing dimensions so the image reflects the intended layout.

Make sure below-the-fold content appears

Full-size capture takes the page’s rendered layout, but pages that load content only after scrolling can still produce incomplete images.

Wait for the initial page load to finish.
Scroll through the page once to trigger lazy images, infinite lists, or intersection-observer content.
Wait for fonts, images, and animations to settle.
Run Capture a full size screenshot again.

If the page is an infinite feed, there may be no stable “full page.” Stop loading at a known point or use an automated capture with a fixed wait and a defined viewport.

Common problems and fixes

The screenshot only shows the visible viewport

You selected Capture screenshot, which is the viewport-only command. Enter Device mode, open More options, and select Capture a full size screenshot.

Open DevTools with Command + Option + I, then click Toggle device toolbar. If the action bar is crowded, open the DevTools overflow menu and locate the device-toolbar control.

The page is cut off or content is missing

Scroll through the page first to trigger lazy loading, wait for network activity to finish, and capture again. Expand collapsed sections that must appear in the image.

Sticky headers repeat or cover content

Sticky elements remain part of the rendered page. You can temporarily disable their position: sticky or position: fixed rule in the Elements panel, or use a capture workflow that hides selected elements before rendering.

Animations create inconsistent frames

Pause animations in DevTools’ Rendering tools or wait until the desired frame is visible. Animated carousels and videos may otherwise appear at different positions between captures.

Capture area screenshot is unavailable

Dock DevTools to the browser window. Chrome documents that area capture does not work while DevTools is undocked.

The result is unexpectedly narrow or wide

Check the width in Device mode. A device preset may have changed the CSS viewport and activated a mobile breakpoint.

When Chrome DevTools is enough

DevTools is a good choice for an occasional manual screenshot, debugging responsive layouts, or documenting a page while you work in Chrome. It is interactive, free, and already installed with the browser.

For repeated captures, scheduled jobs, many URLs, or a server-side workflow, a browser API avoids keeping a Mac session open and gives you consistent request parameters.

Or skip the browser setup

ScreenshotNeo returns a PNG, JPEG, WebP, or PDF from one GET request. Its capture options include full-page screenshots with lazy images loaded, custom viewports and device presets, retina scale, waiting for a selector or network idle, custom CSS and JavaScript, hidden selectors, cookies and headers, dark mode, and element capture.

See the ScreenshotNeo documentation for the complete option list and API details.

cURL

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,
)
r.raise_for_status()
open("shot.webp", "wb").write(r.content)

Node.js

import { writeFile } from "node:fs/promises";

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(`${res.status} ${res.statusText}`);
await writeFile("shot.webp", Buffer.from(await res.arrayBuffer()));

Cookie banners, newsletter popups, and chat widgets are removed before the shot. Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed, and the response identifies the result with X-Page-Verdict and X-Billed headers. ScreenshotNeo also provides an MCP server so Claude, Cursor, and other MCP clients can call take_screenshot, get_page_info, and capture_pdf.

The Free plan includes 1,000 screenshots each month with no card. Paid plans start at $5 for 3,000 screenshots. Create a free ScreenshotNeo account.

Performance, reliability, and cost considerations

Manual DevTools: fastest for one-off work, but results depend on your current browser state, extensions, cookies, and page timing.
Dynamic pages: wait for lazy content, fonts, and network requests before capturing.
Repeatability: record viewport dimensions, device pixel ratio, login state, and the time after load.
Automation cost: ScreenshotNeo bills only clean shots; failed loads, bot checks, blank pages, timeouts, and cache hits are free. Choose a cache TTL when repeated URLs do not need a fresh render.
Scale: ScreenshotNeo supports asynchronous jobs with signed webhooks and bulk capture of up to 100 URLs per call.

FAQ

Can Chrome capture a full page without an extension?

Yes. Chrome DevTools includes Capture a full size screenshot in Device mode.

Does full-size capture include content below the fold?

Yes, it captures page content outside the visible viewport.

Is Device mode the same as using a real phone?

No. It simulates a mobile viewport and related browser conditions on your computer.

Command + Shift + P.

Can I automate this from a server?

Use a screenshot API such as ScreenshotNeo when you need repeatable, unattended captures or bulk processing.