How to Take a Snapshot of an HTML Page

“Snapshot” can mean several different files. A single portable HTML document, an HTML file with an assets folder, a DOM captured after JavaScript runs, a visual screenshot, and a PDF are different outputs.

Choose the output first:

What you need	Best documented method	Result
One portable HTML file	SingleFile	One saved HTML file containing the page and inlined resources where supported
HTML plus separate pictures and files	Firefox Web page, complete	An HTML file and a resource directory
Original HTML structure without pictures	Firefox Web page, HTML only	The page HTML without downloaded images
DOM after scripts run	Chrome headless `--dump-dom`	Serialized DOM after parsing and script execution
Visual record	Firefox Developer Tools or Chrome headless `--screenshot`	PNG screenshot
Printable document	Chrome headless `--print-to-pdf`	PDF

1. Save a complete page as one HTML file

Use the SingleFile browser extension or CLI when the requirement is one file that can be opened later. Its documentation lists support for Chrome, Firefox, Edge, Safari, Vivaldi, Brave, Waterfox, Yandex and Opera, including desktop and mobile variants where supported. Check the current store listing for your browser and device before installing.

Browser steps

Install SingleFile from the browser store linked by its project documentation.
Open the page you want to preserve.
Click the SingleFile toolbar button. The saved file normally goes to the browser’s configured downloads folder.
Open the resulting .html file in a browser and check the content you need.

SingleFile also exposes context-menu actions for the current tab, a selection, or a selected frame. Its multi-tab commands can target selected, unpinned, or all tabs. The saved document may not preserve every interactive behavior of every site, so verify important captures.

When one file is the wrong format

SingleFile’s project compares HTML, self-extracting ZIP, MHTML, Safari Web Archive, and HTML-plus-folder formats. MHTML viewing is limited mainly to Chromium-based browsers and Internet Explorer, while Safari Web Archive is intended for Safari. Choose the format your recipients can open.

2. Save HTML and its assets with Firefox

Firefox provides two relevant Save Page As choices. Mozilla documents that Web page, complete writes a page file plus a directory containing pictures and other supporting resources. Web page, HTML only saves the original HTML without pictures and preserves its HTML link structure. Mozilla cautions that the complete format may not preserve the original link structure.

Open the page in Firefox.
Open the browser menu and choose Save Page As.
Choose Web page, complete when the page and its downloaded resources should travel together.
Choose Web page, HTML only when you need the original HTML structure and do not need local pictures.
Save, then keep the HTML file and resource directory together for the complete-page format.

Open the saved result and test links, images, styles and any required scripts. The browser’s documented file layout does not guarantee that a complex application will work offline.

3. Capture the rendered DOM after JavaScript

A plain HTTP download returns source received from the server. Chrome headless --dump-dom instead parses the document, executes scripts that alter it, and serializes the resulting DOM. That makes it useful for pages whose visible content is inserted after load.

chrome --headless --dump-dom https://example.com/ > page.html

The executable may be named differently on your system, such as google-chrome or chromium. Confirm the command for the installed browser version.

Control waiting time

# Stop waiting after five seconds
chrome --headless --timeout=5000 --dump-dom https://example.com/ > page.html

# Give time-dependent page code a virtual-time budget
chrome --headless --virtual-time-budget=42000 --dump-dom https://example.com/ > page.html

A timeout or virtual-time budget only limits or advances browser time. It cannot guarantee that a network request, login flow, consent action or user-triggered component has completed. Inspect the output.

4. Take a full-page screenshot

Firefox Developer Tools

Open Developer Tools settings.
Under Available Toolbox Buttons, enable Take a screenshot of the entire page.
Click the screenshot button. Firefox saves the image to its downloads directory.

Firefox’s Inspector can capture a particular node. The Web Console :screenshot helper supports options including --fullpage, --selector, --delay, --dpr, --filename and --clipboard.

Chrome headless

chrome --headless --screenshot --window-size=412,892 https://example.com/

This captures the viewport shown by the supplied window size. For a page-length image, use a browser workflow that supports full-page capture or an API with a full-page option. A screenshot is an image, not editable HTML.

5. Generate a PDF

chrome --headless --print-to-pdf=page.pdf https://example.com/

PDF output is suited to reading and printing. It does not preserve the page as an interactive web application and may paginate content differently from the browser viewport.

6. Automate a snapshot in code

For repeatable jobs, run a real browser so scripts, layout and fonts are evaluated before saving. A minimal shell wrapper can capture the DOM and return a failure code:

#!/usr/bin/env bash
set -euo pipefail
url="${1:?usage: $0 URL}"
out="${2:-page.html}"
chrome --headless --dump-dom --timeout=15000 "$url" > "$out"
test -s "$out"

For visual or PDF automation, replace --dump-dom with --screenshot or --print-to-pdf. Use a fixed viewport when comparing images. If content appears after a delayed request, increase the wait budget and inspect the result rather than assuming the page is complete.

7. Or skip the browser setup

ScreenshotNeo provides a website screenshot API and MCP server. One GET request returns PNG, JPEG, WebP or PDF. Before capture it accepts cookie and consent banners and removes more than 60 known consent platforms, newsletter popups and chat widgets; each cleanup step can be disabled. Bot checks, blank pages, timeouts, failed loads and cache hits are not billed, and response headers identify the page verdict and whether the request was billed.

See the ScreenshotNeo API documentation for all options.

cURL

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

Python

import requests

r = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={"access_key": "YOUR_API_KEY", "url": "https://example.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://example.com'
});
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const body = Buffer.from(await res.arrayBuffer());
require('node:fs').writeFileSync('shot.webp', body);

Useful capture options

Full-page capture with lazy images loaded, or one element selected by CSS.
Dark mode, 12 device presets, arbitrary viewport sizes and retina scale.
PDF paper size, margins, landscape mode and page ranges.
Custom CSS and JavaScript, clicks, selector waits, delays and network-idle waits.
Hide selectors; block ads, trackers, requests or resource types.
Custom headers, cookies, user agent and Authorization.
Timezone, geolocation and transparent backgrounds.
Image resizing, selectable cache TTL, signed links for public <img> tags.
Asynchronous jobs with signed webhooks, bulk capture of up to 100 URLs per call, usage API and OpenAPI specification.

Parameter names used by other screenshot APIs also work, which can simplify migration. The MCP server exposes take_screenshot, get_page_info and capture_pdf for Claude, Cursor and other MCP clients.

There are 1,000 free screenshots each month with no card. Paid plans start at $5 for 3,000 shots; every feature is included on every plan. Create a free ScreenshotNeo account.

8. Choosing the right snapshot method

Question	Choose
Must the result be one portable file?	SingleFile HTML
Should assets remain separate?	Firefox Web page, complete
Do you need server HTML exactly as sent?	HTML-only save or an HTTP client
Do scripts change the content you need?	Chrome `--dump-dom` or a browser/API capture
Will someone inspect pixels or compare layouts?	Full-page screenshot
Is the deliverable for printing?	PDF
Do you need recurring, server-side captures?	ScreenshotNeo API or MCP server

9. Troubleshooting

The saved HTML is blank or missing content

The page may render its content after asynchronous requests, require an interaction, or be blocked by a bot check. Use a browser-based method, increase the Chrome wait budget, perform the required interaction before saving, and inspect the output. A plain source fetch will not include DOM changes made by scripts.

Images or styles are missing

You may have selected Firefox’s HTML-only format, or the page may load resources from protected or temporary URLs. Use Web page, complete or SingleFile, keep the resource directory beside the HTML file, and verify the saved file while online.

The complete-page links do not behave like the original

Mozilla documents that Web page, complete may not preserve the original HTML link structure. Use HTML only when preserving that structure matters, or use the original live URL for navigation.

The screenshot cuts off the page

A viewport screenshot has a fixed height. Use Firefox’s entire-page capture or a full-page API option. For lazy-loaded images, wait for the page to finish loading or use a capture service that loads lazy images.

Chrome reports an unknown flag

Executable names and command-line support vary by browser version. Run the installed browser’s help output, update the command to that executable, and check the current Chrome Headless documentation.

A capture is slow or inconsistent

Large pages, third-party resources, animations and network-dependent widgets add work. Set a bounded timeout, use a selector or network-idle wait that matches the page, block unnecessary resource types, disable animations with custom CSS when appropriate, and keep viewport and device settings fixed for repeatable output.

How do I avoid paying for failed captures?

ScreenshotNeo identifies page verdict and billing in response headers. Bot checks, blank pages, timeouts, failed loads and cache hits are not billed.

10. Performance, reliability and cost notes

Performance: Full-page images and DOM serialization require more browser work than a raw HTTP request. Waiting for network idle can be slower than a short fixed delay but is often more appropriate for pages with late requests.
Reliability: Save the output and inspect it. No documented workflow guarantees that every interactive, authenticated or protected site can be reproduced offline.
Repeatability: Fix the browser version, viewport, device scale, timezone, geolocation and wait policy when comparing snapshots.
Storage: SingleFile reduces a page to one file; Firefox complete saves a file plus resources; screenshots and PDFs are fixed binary artifacts.
API cost: ScreenshotNeo offers 1,000 free shots monthly without a card. Starter is $5 for 3,000, Growth $15 for 15,000, Pro $39 for 60,000, Scale $99 for 250,000 and Business $249 for 1,000,000; annual billing gives two months free.

FAQ

Is an HTML snapshot the same as a screenshot?

No. HTML remains structured and potentially editable; a screenshot records pixels; a rendered DOM records the browser’s post-script document.

Can I snapshot a page that requires JavaScript?

Yes, use a real browser such as Chrome headless, Firefox, SingleFile, or ScreenshotNeo. A plain HTTP response does not execute page scripts.

Which format is easiest to email?

A single HTML file is convenient when the recipient can open it in a browser. A PDF or image is more predictable for viewing and printing.

Will a saved page work offline?

It may, but dynamic requests, authentication, protected resources and interactive behavior can still depend on the original site. Always open and verify the saved artifact.

Can an AI agent take snapshots?

Yes. ScreenshotNeo’s MCP server provides take_screenshot, get_page_info and capture_pdf for MCP clients such as Claude and Cursor.