Capture screenshots of websites
npm install capture-website> Capture screenshots of websites
It uses Puppeteer (Chrome) under the hood.
See capture-website-cli for the command-line tool.
``sh`
npm install capture-website
Note to Linux users: If you get a sandbox-related error, you need to enable system sandboxing.
`js
import captureWebsite from 'capture-website';
await captureWebsite.file('https://sindresorhus.com', 'screenshot.png');
`
Capture a screenshot of the given input and save it to the given outputFilePath.
Intermediate directories are created for you if they do not exist.
Returns a Promise that resolves when the screenshot is written.
Capture a screenshot of the given input.
Returns a Promise with the screenshot as binary.
Capture a screenshot of the given input.
Returns a Promise with the screenshot as Base64.
#### input
Type: string
The URL, file URL, data URL, local file path to the website, or HTML.
`js
import captureWebsite from 'capture-website';
await captureWebsite.file('index.html', 'local-file.png');
`
#### options
Type: object
##### inputType
Type: string\'url'
Default: \'url' | 'html'
Values:
Set it to html to treat input as HTML content.
`js
import captureWebsite from 'capture-website';
await captureWebsite.file('
##### width
Type:
\
Default: 1280Page width.
##### height
Type:
\
Default: 800Page height.
##### type
Type:
\
Values: 'png' | 'jpeg' | 'webp' | 'pdf'\
Default: 'png'Output type.
> [!NOTE]
> When using
, the clip, element, and quality options are not supported. Use the pdf option for PDF-specific settings.##### quality
Type:
number\
Values: 0...1\
Default: 1Image quality. Only for
and {type: 'webp'}.##### scaleFactor
Type:
number\
Default: 2Scale the webpage
times.The default is what you would get if you captured a normal screenshot on a computer with a retina (High DPI) screen.
##### emulateDevice
Type:
string\
Values: Devices (Use the name property)Make it look like the screenshot was taken on the specified device.
This overrides the
width, height, scaleFactor, and userAgent options.`js
import captureWebsite from 'capture-website';await captureWebsite.file('https://sindresorhus.com', 'screenshot.png', {
emulateDevice: 'iPhone X'
});
`##### fullPage
Type:
\
Default: falseCapture the full scrollable page, not just the viewport.
> [!WARNING]
> Screenshots taller than 16384px will repeat content due to a Chromium limitation. Use the
option to capture sections separately.##### preloadLazyContent
Type:
boolean\
Default: falseScroll through the entire page to trigger lazy-loaded content before capturing the screenshot.
This scrolls through the page viewport by viewport, waiting for network idle after each scroll, then returns to the original scroll position. This is useful for capturing third-party widgets, marketing banners, or any content that only loads when scrolled into view.
> [!NOTE]
> This option is automatically enabled when
is true.`js
import captureWebsite from 'capture-website';await captureWebsite.file('https://example.com', 'screenshot.png', {
preloadLazyContent: true
});
`##### defaultBackground
Type:
\
Default: trueInclude the default white background.
Disabling this lets you capture screenshots with transparency.
##### timeout
Type:
(seconds)\
Default: 60The number of seconds before giving up trying to load the page.
Specify
to disable the timeout.##### throwOnHttpError
Type:
boolean\
Default: falseThrow an error if the HTTP response status code is not in the 200-299 range.
This only applies to
and https:// URLs. Local files, data URLs, and HTML content are not affected.`js
import captureWebsite from 'capture-website';// Throws an error if the page returns a 404, 500, etc.
await captureWebsite.file('https://example.com/missing', 'screenshot.png', {
throwOnHttpError: true
});
`##### delay
Type:
(seconds)\
Default: 0The number of seconds to wait after the page finished loading before capturing the screenshot.
This can be useful if you know the page has animations that you like it to finish before capturing the screenshot.
This is also useful for capturing lazy-loaded content from third-party scripts (marketing widgets, analytics, etc.) that load asynchronously after the initial page load.
##### waitForElement
Type:
Wait for a DOM element matching the given CSS selector to appear in the page and to be visible before capturing the screenshot. It times out after
seconds.##### element
Type:
stringCapture the DOM element matching the given CSS selector. It will wait for the element to appear in the page and to be visible. It times out after
seconds. Any actions performed as part of options.beforeScreenshot occur before this.##### hideElements
Type:
string[]Hide DOM elements matching the given CSS selectors.
Can be useful for cleaning up the page.
on the matched elements.`js
import captureWebsite from 'capture-website';await captureWebsite.file('https://sindresorhus.com', 'screenshot.png', {
hideElements: [
'#sidebar',
'img.ad'
]
});
`##### removeElements
Type:
Remove DOM elements matching the given CSS selectors.
on the matched elements, so it could potentially break the website layout.##### clickElement
Type:
stringClick the DOM element matching the given CSS selector.
##### scrollToElement
Type:
Scroll to the DOM element matching the given CSS selector.
###### element
Type:
A CSS selector.
###### offsetFrom
Type:
\
Values: 'top' | 'right' | 'bottom' | 'left'Offset origin.
###### offset
Type:
Offset in pixels.
##### disableAnimations
Type:
\
Default: falseDisable CSS animations and transitions.
##### blockAds
Type:
\
Default: true##### isJavaScriptEnabled
Type:
\
Default: trueWhether JavaScript on the website should be executed.
This does not affect the
and modules options.##### modules
Type:
string[]Inject JavaScript modules into the page.
Accepts an array of inline code, absolute URLs, and local file paths (must have a
extension).`js
import captureWebsite from 'capture-website';await captureWebsite.file('https://sindresorhus.com', 'screenshot.png', {
modules: [
'https://sindresorhus.com/remote-file.js',
'local-file.js',
]
});
##### scripts
Type:
Same as the
option, but instead injects the code as