---
title: Screenshot Page
description: Capture a screenshot of the opened page or selected element
---

Take a PNG screenshot of the active tab: what is on screen, the whole page, or one element.

## What it does

Pick a **Mode**:

* **Viewport**: the part of the page currently visible in the tab.
* **Full Page**: the entire page, from top to bottom.
* **Element**: just the element in **DOM Selector**, even if it is taller than the screen.

The screenshot is made from what the browser actually shows, so images, web fonts, charts, canvases and video frames look exactly as they do on screen. For **Full Page** and **Element**, the node scrolls the page, captures it piece by piece and stitches the pieces into one image. Afterwards it puts the page back where you had scrolled it, even if the capture fails.

The image is returned both as a data URL and as a file attached to the item, so nodes that accept files (image editing, uploads, AI vision nodes) can use it directly.

## When to use it

* Keep a visual record of a page at a moment in time: an order confirmation, a dashboard, a price.
* Send a picture of a chart or an error message to a chat channel or a ticket.
* Give a page or a widget to an image AI node to describe or classify it.
* To read the page's content as text instead, use [Get All Text](/nodes/extension/getalltext/).

## Inputs and settings

**DOM Selector** is used only in **Element** mode. Click the crosshair button in the field and click the element on the page, or type a CSS selector such as `#chart`.

## Outputs

Each output item has these fields:

```json title="Shape of an output item"
{
  "mode": "…",
  "selector": "…",
  "dataUrl": "…",
  "found": true,
  "boundingBox": {},
  "$binary": {}
}
```

* `dataUrl`: the image as `data:image/png;base64,…`. The same image is attached as a file in `$binary.data`.
* `found`: `false` in **Element** mode when the selector matches nothing. `dataUrl` is then empty and no file is attached.
* `boundingBox`: the captured area (`top`, `left`, `width`, `height`, in page pixels). In **Element** mode it is the element's position on screen before the capture.
* `mode` and, in **Element** mode, `selector`: what was captured.

## Dependencies and credentials

None. This node needs no connection and has no slots for other nodes.

No credential is needed. The first time a screenshot runs, AWFlow asks for your permission to capture images of the web pages you open. Choose **Allow**. The browser usually does not ask again, because this is covered by the site access you accepted when you installed the extension. Once allowed, screenshots work in every workflow, including scheduled and triggered runs.

## Example workflow

1. A [Schedule](/nodes/builtin/trigger/schedule/) trigger runs every morning.
2. [Tab Control](/nodes/extension/tabcontrol/), **Operation** = **Open**, opens your dashboard with **Wait For Load** on.
3. **Screenshot Page** with **Mode** = **Element** and **DOM Selector** set to the chart.
4. [Slack](/nodes/builtin/integration/slack/), **File → Upload**, posts the image to `#daily-metrics`.

## Common issues

* **"Screenshot Page needs permission to capture web pages…"** You have not allowed screenshots yet. You can only allow it while the AWFlow app is open, so run the workflow once from the app or the side panel and choose **Allow**. A run started by a trigger while the app is closed fails with this message until you do.
* **"Screenshot … is too large (maximum 64 tiles or 100000000 pixels). Use Element mode to capture a smaller target."** Very long pages exceed the limit. Capture a specific element instead.
* **`found` is `false` and there is no image.** **DOM Selector** matched nothing. Check it with **Ping**, or wait for the element with [Wait For Element](/nodes/extension/ui/wait-for-element/) first.
* **A sticky header appears several times in a Full Page image.** Each piece shows what is on screen while that part is scrolled into view, so fixed headers and banners repeat. Capture a specific element to avoid it.
* **Images or animations look different from one part to the next.** Full Page and Element captures take several frames over a few seconds. Let the page finish loading, and scroll it once so late-loading images appear, before running the node.

## Related nodes

* [Caption Image](/nodes/builtin/ai/localai/caption-image/): describe the screenshot on your device.
* [Edit Image](/nodes/builtin/datatransformation/editimage/): crop or resize it.
* [Download as file](/nodes/builtin/datatransformation/downloadasfile/): save it to your computer.
* [Get Page Metadata](/nodes/extension/getpagemetadata/): the page's title and address to go with it.