The Tool Desk
Outbyte Driver Updater FREEScan for outdated or missing drivers - takes under a minuteDriver Scan →Outbyte PC Repair FREEClear out junk files and repair common Windows errorsFree Scan →iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more
Use Puppeteer’s page.screenshot() method with type: 'jpeg' to capture an HTML page as a JPEG. Set path to a .jpg filename to save it, and add quality (0–100) if you want to control compression. For a full-page image, set fullPage: true.
Generate a JPEG screenshot with Puppeteer
Install Puppeteer in your Node.js project, then launch a browser, navigate to the page, and call page.screenshot(). The following is an illustrative combination of the documented options; the official guide’s example uses PNG rather than JPEG. See the Puppeteer screenshots guide and the ScreenshotOptions reference.
import puppeteer from 'puppeteer';
const browser = await puppeteer.launch();
try {
const page = await browser.newPage();
await page.goto('https://example.com', { waitUntil: 'networkidle2' });
await page.screenshot({
path: 'page.jpg',
type: 'jpeg',
quality: 85,
fullPage: true,
});
} finally {
await browser.close();
}Run the script in a Node.js project where Puppeteer is installed. The browser is closed in a finally block so it also shuts down if navigation or capture fails. Choose a real target URL and an output path your process can write to.
Free tools Windows power users keep installed
One-click scans. No signup required.
Choose the capture area and JPEG options
JPEG format and quality
type: 'jpeg' selects JPEG. Puppeteer also documents png and webp as screenshot formats. The format can be inferred from the path extension, but specifying the type makes the intended output explicit. The options are documented in the ScreenshotOptions reference and ImageFormat type.
#1 Best Overall
The quality value is a number from 0 to 100 and applies to JPEG, not PNG. Puppeteer does not specify one universally best value. Select a value for your use case and inspect the resulting image; a particular value such as 85 is an example, not a documented recommendation.
Viewport, full page, and clipped region
fullPage: truecaptures the full page rather than only the current viewport. Its default isfalse.- Use
clipto capture a defined rectangle. The screenshot options reference documentscaptureBeyondViewportas defaulting tofalsewhen there is no clip andtrueotherwise. - For an ordinary viewport screenshot, omit
fullPageor set it tofalse.
These settings control capture scope, not whether the page has finished rendering. Make sure the page has reached the state you intend to capture before calling the screenshot method.
Rank #2
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
Capture one HTML element
Use an element handle’s screenshot() method when you need an image of a single element rather than the entire page. The guide notes that Puppeteer scrolls the element into view if it is hidden. A detached element causes an error, so obtain the handle after the relevant page content has loaded and avoid removing it before capture.
PC Slower Than It Used to Be?
A free scan shows the junk files, broken settings and background clutter dragging Windows down - then fixes them in one click.Free scan · Windows 10 & 11Crashes, No Sound, or Screen Glitches?
Random freezes, missing sound and display glitches usually trace back to one bad driver. Find and replace yours safely.Free scan · under a minuteconst element = await page.$('.product-card');
if (!element) {
throw new Error('Could not find .product-card');
}
await element.screenshot({ path: 'element.jpg', type: 'jpeg' });See the screenshots guide for the element-capture flow.
Rank #3
Save the screenshot or use the returned image data
When you provide path, Puppeteer writes the image to that location. If you omit path, Page.screenshot() returns image data instead. It returns a Uint8Array by default and can return a base64 string when base64 encoding is requested; see the Page.screenshot() reference.
This is useful when another part of your application needs the bytes directly—for example, to send them to storage or an image-processing step—rather than first writing a file. If you need a file, providing path is the simplest option.
Rank #4
- Brand: Wiley
- Set of 2 Volumes
- A handy two-book set that uniquely combines related technologies Highly visual format and accessible language makes these books highly effective learning tools Perfect for beginning web designers and front-end developers
Wait for the page state you need
The example uses waitUntil: 'networkidle2', which is also shown in the official navigation example. Treat it as a wait condition, not a guarantee that every site’s meaningful content is ready: an application may render content after navigation or continue background requests. If a screenshot is blank or incomplete, wait for the specific content you need before capture rather than assuming navigation alone means the page is ready. The guide’s launch, navigation, capture, and browser-close sequence is documented at Puppeteer’s screenshots guide.
Do these 3 things before closing this tab:
1Clear out junk files and repair common Windows errors2Scan for outdated or missing drivers - takes under a minute3Repair Windows errors before they cause bigger problemsTroubleshoot common capture problems
- The file is not JPEG: Use
type: 'jpeg'and a JPEG extension such as.jpg. The format can be inferred from the extension, but an explicit type removes ambiguity. - The image contains only the visible viewport: Set
fullPage: truefor a full-page capture. Useclipinstead when you need a specific region. - The image is blank or missing content: Confirm the target URL loads, then wait for the specific content or page state required before calling
screenshot(). The sample’snetworkidle2condition may not correspond to an application’s final rendered state. - The element screenshot fails: Check that the selector matched an element and that the element remains attached to the page at capture time. Puppeteer scrolls a hidden target into view, but a detached element produces an error.
- You cannot find the output file: Check whether
pathwas supplied and whether the process can write to that location. Without a path, the method returns image data instead of saving a file. - JPEG quality has no effect: The documented
qualityoption is for JPEG and does not apply to PNG. Verify the selected screenshot type.
Or skip the browser setup
If you need a screenshot without managing Puppeteer or a browser, ScreenshotNeo provides a website screenshot API and MCP server. One GET request returns an image or PDF. Its clean-shot options accept cookie banners and remove more than 60 known consent platforms, newsletter popups, and chat widgets before capture; each step can be turned off. Bot checks and CAPTCHAs, blank pages, timeouts, failed loads, and cache hits cost nothing, with the page verdict and billing status reported in response headers. AI agents can use its MCP server tools: take_screenshot, get_page_info, and capture_pdf.
For JPEG output, request it with the API’s documented parameters. Check the ScreenshotNeo documentation for current API options and supported formats. This cURL example uses the supplied API pattern with the target URL adapted:
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com -o shot.jpgScreenshotNeo’s Free plan includes 1,000 shots per month without a card; paid plans start at $5 for 3,000 shots. Sign up for ScreenshotNeo’s free plan.
Frequently Asked Questions
Can Puppeteer return a JPEG without saving a file?
Yes. Omit the path option; Page.screenshot() returns image data, a Uint8Array by default.
Does Puppeteer recommend a specific JPEG quality value?
No. Its options reference defines the 0–100 range but does not recommend a universal value.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
