> ## Documentation Index
> Fetch the complete documentation index at: https://learn.workflow.dog/llms.txt
> Use this file to discover all available pages before exploring further.

# HTML to Screenshot

> Render HTML and capture it as a PNG, JPEG, or WebP image.

**HTML to Screenshot** turns an HTML string into an image using Cloudflare
Browser Rendering. It can capture either the configured viewport or the full
height of the rendered document.

## Inputs

| Input                         | Type                     | Required | Description                                                               |
| ----------------------------- | ------------------------ | -------- | ------------------------------------------------------------------------- |
| **Third-party account**       | Cloudflare account       | Yes      | The Cloudflare account used for rendering.                                |
| **HTML**                      | String                   | Yes      | The HTML to render.                                                       |
| **Format**                    | `png`, `jpeg`, or `webp` | Yes      | Image encoding. Defaults to `png`.                                        |
| **Full Page**                 | Boolean                  | No       | Captures the full document instead of only the viewport. Defaults to off. |
| **Wait For Selector**         | String                   | No       | A CSS selector that must appear before capture.                           |
| **Wait Time**                 | Number                   | No       | Extra delay after load, from `0` to `30000` milliseconds.                 |
| **Viewport Width**            | Number                   | No       | Viewport width, up to `1920`. Defaults to `1920`.                         |
| **Viewport Height**           | Number                   | No       | Viewport height, up to `1080`. Defaults to `1080`.                        |
| **JavaScript Code**           | String                   | No       | JavaScript inserted into the rendered HTML before capture.                |
| **Additional API Parameters** | Object                   | No       | Extra fields passed to Cloudflare's screenshot endpoint.                  |

## Output

| Output         | Type | Description                                                                |
| -------------- | ---- | -------------------------------------------------------------------------- |
| **Screenshot** | File | The captured image, named `rendered` with the selected format's extension. |

<Note>
  With **Full Page** off, viewport width and height define the capture area.
  With it on, the width still affects responsive layout while the page height
  expands to include the full document.
</Note>

## Example: generate a social card

Build a fixed-size HTML card with inline CSS, select a `1200` by `630`
viewport, and leave **Full Page** off. Connect **Screenshot** to an upload,
email, or image-processing action.

## Troubleshooting

<AccordionGroup>
  <Accordion title="The screenshot has the wrong responsive layout">
    Change **Viewport Width** before capture. The viewport controls which CSS
    media queries apply.
  </Accordion>

  <Accordion title="The bottom of the document is missing">
    Enable **Full Page**, or increase **Viewport Height** when you intentionally
    want a fixed-size capture.
  </Accordion>
</AccordionGroup>