How to Take a Screenshot of a Web Page in Any Browser

A web-page screenshot can mean two different things:

• Visible screenshot: only the content currently inside the browser window.
• Full-page screenshot: the entire scrollable document, including content below the fold.

Choose the scope before capturing. A normal operating-system screenshot records the visible viewport. Use a browser’s full-page feature or Developer Tools when you need one image of the whole document.

Quick method comparison

Browser or method	Viewport	Full page	Element or region	Output
Firefox	Yes	Yes	Element via Developer Tools	Image
Microsoft Edge Web Capture	Yes	Yes	Selected section	Image
Chrome Developer Tools	Yes	Yes, community-documented workflow	Developer Tools options vary	Image
Safari	Use current Apple guidance	Not confirmed in this guide	Use current Apple guidance	Image or PDF, depending on workflow
Print to PDF	No	Paginated document	No	PDF

Before you capture

1. Open the exact URL and wait for the page to finish loading.
2. Dismiss dialogs that should not appear in the result, or leave them visible if you are documenting the user experience.
3. For a full page, scroll through the document once when possible. Some sites load images or sections only after scrolling.
4. Decide whether you need an image or a PDF. A PDF is a paginated document, not a single screenshot image.
5. Check the result for sticky headers, internally scrolling panels, animations and lazy-loaded images. Browser capture cannot guarantee correct handling for every dynamic layout.

Firefox: visible or full-page screenshot

Firefox has a built-in screenshot command. On desktop, right-click an empty part of the page and choose Take Screenshot. You can also use Ctrl + Shift + S on Windows or Linux, or Command + Shift + S on macOS.

1. Open the page.
2. Open Take Screenshot.
3. Choose Save visible for the current viewport, or Save full page for the complete scrollable page.
4. Save the generated image.

See Mozilla’s current instructions in Take screenshots in Firefox.

Capture an element with Firefox Developer Tools

1. Open Developer Tools and select the Inspector.
2. Right-click the element you want to capture.
3. Use the screenshot command in the element context menu.

Firefox Developer Tools can also capture a full page. If the screenshot button is missing, open Developer Tools settings, find Available Toolbox Buttons, and enable Take a screenshot of the entire page. The Firefox Source Docs screenshot guide describes these tools.

Microsoft Edge: Web Capture

Edge’s Web Capture feature includes a Capture full page option and can capture a selected section.

1. Open the page in Edge.
2. Open Web Capture from the browser menu or the available Web Capture command in your build.
3. Choose Capture full page for the entire document, or select a section for a region.
4. Save or copy the result.

Menu placement can differ between Edge builds. Microsoft’s guide is the reference for the feature: How to Take a Screenshot of a Webpage Using Microsoft Edge.

Google Chrome: full-size capture with Developer Tools

Chrome’s full-page workflow is commonly documented through the Chrome Help Community. It uses Developer Tools, and command names or keyboard shortcuts can change as DevTools evolves.

1. Open the page in Chrome.
2. Open Developer Tools.
3. Open the DevTools command menu.
4. Run Capture full size screenshot.
5. Save the downloaded image.

This procedure is supported here by Chrome Help Community guidance, rather than a current official Chrome Help article. If the command is absent, use the DevTools command search and look for a screenshot action.

Safari and other browsers

This research does not establish current, platform-specific Safari instructions for a full-page web screenshot. Check the current Safari or Apple Help documentation for your macOS or iOS version before relying on a full-page workflow.

For other Chromium-based browsers, look for a Web Capture or Developer Tools screenshot command. Exact menu names and shortcuts vary by browser version. If you only need a document, use the browser’s print-to-PDF workflow and verify the page breaks before sharing it.

Use print to PDF when you need a document

Choose PDF when pagination, selectable text or document handling matters more than one tall image. In most browsers, open the print dialog, select the browser’s PDF destination, review margins and page ranges, then save. Chrome’s documentation covers downloading files and managing PDFs in Download a file and Manage PDFs in Chrome.

Common problems and fixes

Problem	Likely cause	Fix
The result contains only the viewport	A visible-area command was used.	Choose Firefox’s Save full page, Edge’s Capture full page, or Chrome’s Capture full size screenshot.
Images are missing below the fold	Lazy loading waits for scrolling or visibility.	Scroll through the page first, wait for images, then capture again.
A sticky header appears many times	The browser stitched a fixed element into multiple sections.	Hide the fixed element with a temporary CSS rule, capture sections separately, or use an automated tool with selector hiding.
An internal panel is cut off	The page contains an element with its own scrollbar.	Capture that element separately or expand it before capture.
The page is blank or partially loaded	Network, script, consent or bot-check activity has not finished.	Wait, reload, complete the required interaction, disable conflicting extensions, and try again.
Chrome’s command is not found	DevTools labels and layouts vary.	Search the DevTools command menu for “screenshot” and use the full-size action if available.
The file is too tall or too large	Long pages create very large raster images.	Capture a specific element, split the page into sections, reduce the viewport or resize the output afterward.
Fonts or animations differ	Web fonts, animations or timing changed during capture.	Wait for fonts, pause animations with temporary CSS, and capture at a consistent viewport size.

For repeatable or automated captures

Manual browser commands are useful for one-off work. Automation is a better fit for scheduled monitoring, documentation pipelines, many URLs, fixed viewport sizes, element captures, authenticated pages or consistent output formats.

Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server. One GET request returns a PNG, JPEG, WebP or PDF. It can capture full pages with lazy images loaded, a single CSS-selected element, dark mode, custom viewports and device presets, retina scale, custom CSS and JavaScript, clicks, waits, blocked resources, headers, cookies, user agents, authorization, time zones and geolocation. See the ScreenshotNeo API documentation for the complete option list.

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

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

ScreenshotNeo removes cookie and consent banners, newsletter popups and chat widgets before the capture; each cleanup step can be turned off. Bot checks, blank pages, timeouts, failed loads and cache hits cost nothing, and the response identifies the result with X-Page-Verdict and X-Billed headers. Its MCP server provides take_screenshot, get_page_info and capture_pdf tools for Claude, Cursor and other MCP clients.

For performance and cost, reuse cached results with a TTL when freshness allows, use a viewport or element instead of a full page when appropriate, and use bulk capture for up to 100 URLs per call. Async jobs with signed webhooks suit long-running batches. A usage API and OpenAPI specification help you monitor and integrate the service. Plans include 1,000 free shots per month with no card; paid plans start at $5 for 3,000 shots, and every feature is available on every plan.

Create a free ScreenshotNeo account and get 1,000 screenshots a month with no card.

Reliability checklist

• Use a fixed viewport and device preset for comparable results.
• Wait for a selector, a delay or network idle when content is asynchronous.
• Set a timeout appropriate to the page and retry transient failures.
• Record the URL, capture time, viewport and output format with each artifact.
• Inspect verdict and billing headers when a result matters operationally.
• Use signed links for public image tags and signed webhooks for asynchronous jobs.

FAQ

Should I capture the visible area or the full page?

Use the visible area for a bug report or what a user currently sees. Use full page for design review, archiving or documentation of content below the fold.

Is a full-page screenshot the same as a PDF?

No. A full-page screenshot is one raster image. A PDF is a paginated document that can preserve selectable text and printing structure.

Why can a full-page image differ from what I see while scrolling?

Lazy loading, sticky elements, animations and internal scroll containers can behave differently during stitching. Inspect the output and capture an element or section when needed.

Can I capture a page that requires cookies or authorization?

Manual browser capture uses the current browser session. An automated API must be given the required cookies, headers or authorization through its supported configuration.

What is the simplest repeatable option?

Use an automated screenshot API with a fixed viewport, wait condition and output format. ScreenshotNeo provides those controls plus cleanup of common overlays and billing headers that identify the result.