How to Capture Website Screenshots at 100 Percent Browser Zoom for Documentation

To capture a website screenshot at 100% browser zoom, first check the browser’s page zoom for the current site, set it to 100%, then capture either the visible viewport or the full page. Page zoom affects how the page is rendered; it is separate from operating-system display scaling, device pixel ratio, post-capture image magnification, and zoom controls inside the website itself.

For documentation, decide what the screenshot must prove before you capture it: one visible screen state, the whole document, or a specific element. Then save the image and inspect the crop and content.

1. Confirm page zoom is 100%

In Chrome, use the toolbar or browser menu’s Zoom control to inspect or change the current page zoom. Chrome also has a global default under Settings → Appearance → Page zoom. A site-specific zoom level can override the global default, so check the site’s saved zoom level if the page does not appear to be at 100%.

Chrome’s site-specific settings are available under Settings → Privacy and security → Site Settings → Additional content settings → Zoom levels. Remove or adjust an override there if needed. Menu names and paths can vary by Chrome release and platform. See Chrome’s page zoom help.

This concerns browser page zoom only. If you need to document how a page looks at a different browser zoom, capture that state intentionally and label it accurately rather than describing it as 100%.

2. Choose the capture scope

What you need to document	Capture type	Browser workflow
One screen as currently shown	Viewport	Chrome DevTools: Capture screenshot; Firefox: Save visible
The entire document, including content below the fold	Full page	Chrome DevTools: Capture a full size screenshot; Firefox: Save full page
One component or isolated region	Element	Firefox DevTools: Screenshot Node

A viewport image is useful for documenting a specific visible state. A full-page image includes content that is not currently visible. An element capture is useful when the evidence should focus on one component. The available commands and labels can vary by browser version.

3. Capture in Chrome

Open the page and confirm that its current page zoom is 100%, including any site-specific zoom setting.
Open Chrome DevTools and open the DevTools command menu using the menu shown in your version of DevTools.
Choose Capture screenshot for the current viewport, or Capture a full size screenshot for the whole page.
Save the resulting image and inspect it for the intended state and crop.

Chrome’s official instructions distinguish the viewport capture from the full-size capture in its Device mode documentation.

4. Capture in Firefox

Open the page and confirm that browser page zoom is 100% for the page.
Use Firefox’s screenshot feature and choose Save visible for the current view or Save full page for the entire document.
For an individual element, use Firefox DevTools’ Screenshot Node workflow.
Save and inspect the image before adding it to documentation.

See Mozilla’s Firefox screenshot help and Firefox DevTools documentation for the browser’s built-in capture workflows.

5. Check the saved image

Confirm that the image shows the intended page and browser state.
Check that a viewport capture has the expected visible area, or that a full-page capture includes the content the documentation requires.
For an element capture, confirm that the selected element is the subject and is not unintentionally clipped.
Check that transient overlays, dialogs, or loading states are either intentionally shown or absent.
Use a clear filename and, where relevant, record the browser, page zoom, and capture scope alongside the image.

These checks are practical documentation guidance. The cited browser instructions describe capture controls; they do not establish identical pixel density, color, or rendering across browsers and systems.

Or skip the browser setup

ScreenshotNeo captures a website from one API request. For this task, its normal capture can produce a clean image without setting up browser DevTools locally. Review the ScreenshotNeo API documentation for available parameters and formats.

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,
)
r.raise_for_status()
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}`);
const fs = await import('node:fs/promises');
await fs.writeFile('shot.webp', Buffer.from(await res.arrayBuffer()));

Cookie and consent banners, newsletter popups, and chat widgets are removed before the shot; each cleanup step can be turned off.
Bot checks or CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed. Response headers identify the page verdict and billing status.
An MCP server lets AI agents, including Claude, Cursor, and other MCP clients, take screenshots.
1,000 screenshots per month are free with no card. Paid plans start at $5 for 3,000 screenshots.

Troubleshooting

Symptom	Likely cause	What to do
The page does not look like it is at 100%	A site-specific zoom level may override the global default.	Check the browser’s current Zoom control and the saved zoom level for that site.
The screenshot omits content below the fold	A viewport capture was selected.	Use the full-page or full-size screenshot command.
The screenshot includes too much page	A full-page capture was selected when only the visible state was needed.	Choose the visible or viewport capture option.
The capture does not isolate the desired component	A page-level capture was used.	Use Firefox DevTools’ Screenshot Node workflow for an individual element, or capture the page and crop it as a separate documentation step.
Menu labels do not match these steps	Browser version, platform, or DevTools layout differs.	Look for the equivalent visible/full-page screenshot action in that browser’s current documentation.
The page has an unexpected overlay or incomplete content	The page may still be loading or a transient dialog is present.	Wait for the intended state, dismiss or preserve the overlay deliberately, then capture again and inspect the saved image.

Performance, reliability, and cost

For a one-off screenshot, native browser capture avoids setting up a separate capture service. Full-page capture covers more document content than viewport capture, so choose it only when that extra scope is needed. Dynamic pages can change while you prepare a capture; wait for the state you intend to document and inspect the result.

The official sources describe browser controls, not timing, resolution guarantees, cross-browser pixel equivalence, or behavior on every dynamic page. No performance comparison is established here. Native browser capture has no per-shot API charge described in these browser workflows. If you use ScreenshotNeo instead, its free plan includes 1,000 shots per month with no card; paid plans start at $5 for 3,000, and only clean shots are billed.

FAQ

Does 100% browser zoom mean 100% operating-system display scaling?

No. This guide uses 100% to mean the browser’s page zoom setting for the site. Operating-system scaling and device pixel ratio are separate settings.

Should I use a viewport or full-page screenshot for documentation?

Use a viewport capture when the evidence is one screen state. Use a full-page capture when the document needs content beyond the visible area. Use an element capture when one component is the subject.

Does full-page capture guarantee every dynamic page will be represented exactly as seen while scrolling?

The cited browser documentation explains the capture option but does not guarantee identical behavior for every dynamic page. Inspect the saved image and document any relevant limitation.

Is special screenshot hardware required?

No special physical accessory is required for the browser workflows described here; they use browser controls and DevTools.