n8n: HTML/CSS to Image API

Generate images, website screenshots, PDFs, and signed image URLs in your n8n workflows.

Verification pending

We’ve submitted the node to n8n for verification. While that review is in progress, you can install it as a community node on a self-hosted n8n instance. It is not currently available to install on n8n Cloud.

Install on self-hosted n8n

An n8n instance owner or admin can install the node from npm:

In n8n, go to Settings → Community Nodes.
Select Install.

Enter this npm package name:

@html-css-to-image/n8n-nodes-html-css-to-image

Acknowledge the community-node installation warning.
Select Install.

After installation, add the HTML/CSS to Image API node to a workflow.

See n8n’s community-node installation guide for the latest requirements and installation details.

Add your credentials

Open the HTML/CSS to Image node and create a new HTML/CSS to Image API credential.
Copy your API ID and API Key from the HTML/CSS to Image dashboard.
Enter both values and save the credential.

n8n stores the values in its encrypted credential store and tests them against the HTML/CSS to Image ping endpoint.

Available operations

Create From HTML/CSS — Render HTML and CSS as an image or PDF.
Create From URL — Take a screenshot of a public webpage.
Create From Template — Render a saved template with dynamic values.
Generate Signed URL — Create a signed template or webpage URL that renders on demand.

All input fields support n8n expressions, so content and options can come from earlier workflow steps.

Choose the output

Image creation operations can return:

The generated image URL and metadata
A binary PNG, JPG, WebP, or PDF file
Both metadata and a binary file

Use binary output when the next node needs a file, such as an email, Slack, S3, or Google Drive node.

Example workflow

To render HTML produced by an earlier step:

Add an HTML/CSS to Image API node.
Select Create From HTML/CSS.
Set HTML to an expression such as {{$json.html}}.
Add CSS and any rendering options you need.
Select URL and Metadata or a binary output.
Execute the workflow.

For saved templates, add each variable under Template Values. You can choose the value type for each property or use an expression that resolves to an object.