# Render to Image — Rendex

> Render an HTML string or a page URL to an image (or PDF) via Rendex. Returns base64-encoded image data with metadata. See the documentation.

- Key: `rendex-render-to-image`
- Type: Action (Write)
- Version: 0.1.0
- App: Rendex (`rendex`) — https://pipedream.com/apps/rendex.md
- This page (HTML): https://pipedream.com/apps/rendex/actions/render-to-image
- Hints: open-world
- Source: https://github.com/PipedreamHQ/pipedream/blob/master/components/rendex/actions/render-to-image/render-to-image.mjs

## Description

Render an HTML string or a page URL to an image (or PDF) via Rendex. Returns base64-encoded image data with metadata. [See the documentation](https://rendex.dev/docs/api-reference#post-screenshot-json).

## Props

| Prop | Type | Required | Description |
|---|---|---|---|
| `html` | `string` | No | The HTML markup to render to an image. |
| `url` | `string` | No | A page URL to render (alternative to HTML). Provide either html or url. |
| `format` | `string` | No | Output file format. Example values: png, jpeg, webp, or pdf. |
| `width` | `integer` | No | Viewport width in pixels (320–3840). Defaults to 1280. |
| `height` | `integer` | No | Viewport height in pixels (240–2160). Defaults to 800. |
| `fullPage` | `boolean` | No | Capture the entire scrollable page instead of just the viewport. |
| `quality` | `integer` | No | Image quality from 1–100 (JPEG/WebP only). |
| `delay` | `integer` | No | Milliseconds to wait after the page settles before capturing (0–10000). |
| `darkMode` | `boolean` | No | Emulate prefers-color-scheme: dark when rendering. |
| `deviceScaleFactor` | `string` | No | Pixel density multiplier from 1 to 3 (e.g. 2 for retina). Defaults to 2. |
| `device` | `string` | No | Device preset that sets viewport size, scale, and user agent in one shot. Explicit width/height/user agent still win. |
| `selector` | `string` | No | Capture only the element matching this CSS selector instead of the whole page. |
| `hideSelectors` | `string[]` | No | CSS selectors for elements to hide (display: none) before capture — e.g. cookie banners, popups, sticky nav. |
| `blockAds` | `boolean` | No | Block known ad/tracker network requests. Enabled by default. |
| `blockCookieBanners` | `boolean` | No | Hide common cookie/consent walls (OneTrust, Cookiebot, Quantcast, …) via a curated CSS list. |
| `timeout` | `integer` | No | Maximum time to wait for the page to load (5–60). Defaults to 30. |
| `waitUntil` | `string` | No | Navigation lifecycle event to wait for before capturing. |
| `bestAttempt` | `boolean` | No | Return a partial capture on timeout instead of erroring. Enabled by default. |
| `css` | `string` | No | CSS injected into the page before capture (up to 50KB). |
| `js` | `string` | No | JavaScript executed in the page before capture (up to 50KB). |
| `userAgent` | `string` | No | Override the browser User-Agent header. |
| `cookies` | `string[]` | No | Cookies to set before loading the page. Each item is a JSON object, e.g. {"name":"session","value":"abc","domain":"example.com"}. Requires a Starter plan or higher. |
| `headers` | `object` | No | Extra HTTP request headers to send with the page load, as a JSON object of key–value pairs, e.g. { "Accept-Language": "de-DE", "X-Debug": "1" }. Requires a Starter plan or higher. |
| `pdfFormat` | `string` | No | Paper size for PDF output (ignored for image formats). |
| `pdfLandscape` | `boolean` | No | Render the PDF in landscape orientation. |
| `pdfPrintBackground` | `boolean` | No | Include background graphics and colors in the PDF. |
| `pdfScale` | `string` | No | PDF render scale from 0.1 to 2. Defaults to 1. |
| `geo` | `string` | No | Two-letter country code (e.g. US, DE) to capture from via a geo-targeted proxy. Pro/Enterprise only. |
| `geoCity` | `string` | No | City to target for the geo proxy. Pro/Enterprise only. |
| `geoState` | `string` | No | State/region to target for the geo proxy. Pro/Enterprise only. |

## Run it

**MCP**

```ts
import { Client } from "@modelcontextprotocol/sdk/client/index.js"
import { StreamableHTTPClientTransport } from "@modelcontextprotocol/sdk/client/streamableHttp.js"
import { PipedreamClient } from "@pipedream/sdk"

const pd = new PipedreamClient({
  projectId: process.env.PIPEDREAM_PROJECT_ID!,
  clientId: process.env.PIPEDREAM_CLIENT_ID!,
  clientSecret: process.env.PIPEDREAM_CLIENT_SECRET!,
  projectEnvironment: "production",
})

const accessToken = await pd.rawAccessToken

const transport = new StreamableHTTPClientTransport(
  new URL("https://remote.mcp.pipedream.net/v3"),
  {
    requestInit: {
      headers: {
        Authorization: `Bearer ${accessToken}`,
        "x-pd-project-id": process.env.PIPEDREAM_PROJECT_ID!,
        "x-pd-environment": "production",
        "x-pd-external-user-id": "{external_user_id}", // any stable ID for this user in your system
        "x-pd-app-slug": "rendex",
      },
    },
  },
)

const mcp = new Client({ name: "my-agent", version: "1.0.0" })
await mcp.connect(transport)

const { tools } = await mcp.listTools()

// listTools() hands your model this tool's input schema, so it can
// fill the arguments itself:
const result = await mcp.callTool({
  name: "rendex-render-to-image",
  arguments: {
    html: "HTML",
    url: "URL",
  },
})
```

**TypeScript**

```ts
import { PipedreamClient } from "@pipedream/sdk"

const pd = new PipedreamClient({
  projectId: process.env.PIPEDREAM_PROJECT_ID!,
  clientId: process.env.PIPEDREAM_CLIENT_ID!,
  clientSecret: process.env.PIPEDREAM_CLIENT_SECRET!,
  projectEnvironment: "production",
})

const result = await pd.actions.run({
  id: "rendex-render-to-image",
  externalUserId: "{external_user_id}", // any stable ID for this user in your system
  configuredProps: {
    rendex: { authProvisionId: "apn_xxxxxxx" },
    html: "HTML",
    url: "URL",
  },
})

console.log(result)
```

**cURL**

```bash
curl -X POST https://api.pipedream.com/v1/connect/{project_id}/actions/run \
  -H "Content-Type: application/json" \
  -H "X-PD-Environment: production" \
  -H "Authorization: Bearer {access_token}" \
  -d '{
    "external_user_id": "{external_user_id}",
    "id": "rendex-render-to-image",
    "configured_props": {
      "rendex": { "authProvisionId": "apn_xxxxxxx" },
      "html": "HTML",
      "url": "URL"
    }
  }'
```

---

- App: https://pipedream.com/apps/rendex.md · All apps: https://pipedream.com/apps