n8n integration

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

An n8n instance owner or admin can install the verified node for everyone on the instance:

1. Open a workflow in n8n and select + to open the Nodes panel.
2. Search for HTML/CSS to Image API.
3. Select the node under More from the community.
4. Select Install.
5. Add the node to your workflow.

See n8n’s verified community-node installation guide for instance settings and the latest installation details.

Most users should install the verified node from the Nodes panel. If you manage community packages manually—for example, on an n8n instance running in queue mode—you can install the package from npm instead:

mkdir -p ~/.n8n/nodes
cd ~/.n8n/nodes
npm install @html-css-to-image/n8n-nodes-html-css-to-image

Restart n8n after installation. This method is only for self-hosted instances; it isn’t needed or available on n8n Cloud.

See n8n’s manual community-node installation guide for Docker and queue-mode details.

1. Open the HTML/CSS to Image node and create a new HTML/CSS to Image API credential.
2. Copy your API ID and API Key from the HTML/CSS to Image dashboard.
3. 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.

• 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.
• Delete — Permanently delete an image by ID.
• 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.

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.

To render HTML produced by an earlier step:

1. Add an HTML/CSS to Image API node.
2. Select Create From HTML/CSS.
3. Set HTML to an expression such as {{$json.html}}.
4. Add CSS and any rendering options you need.
5. Select URL and Metadata or a binary output.
6. 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.

• HTML/CSS to Image on n8n
• npm package
• Source code and issue tracker
• HTML/CSS to Image API documentation
• n8n verified community-node documentation