Español

Lee este artículo en español.

How to turn HTML into an image in Make (HTTP module)

If you automate with Make (formerly Integromat), at some point you'll need to generate an image in a scenario: a social card, a thumbnail, a receipt or an Open Graph image. You don't have to run servers or install odd apps. With the HTTP module and the Cofferdock API, you can have it working in a couple of minutes.

An honest heads-up, since many people search for it that way: Make has no dedicated "HTML to image" module. You do it with the generic HTTP module calling an API that does the work. Here's how, field by field.

What you'll get

You send your design in HTML and you get the image back in PNG or JPEG, ready for the next module in the scenario: upload it to Google Drive, attach it to an email, post it to social media or send it over Telegram. The module's response is already the image file, with no conversion steps in between.

Typical uses in Make:

What you need

Step by step in the HTTP module

Add the HTTP → Make a request module and set it up like this:

The module's output is already the image file. Connect it straight to Google Drive (Upload a file), to Email as an attachment, to social media or wherever you need it. One module and done.

A clear example

Say you want one social card per new row in a spreadsheet. The scenario would be:

  1. A Google Sheets module (Watch Rows) that detects new rows.
  2. A Tools → Set variable module that builds the HTML with the row's data.
  3. The HTTP module above, which turns that HTML into an image.
  4. A Google Drive → Upload a file module that saves the image (mapping the file the HTTP module returns).

Each run gives you a different image, automatically.

Options you can tweak

Add them in the Query String of the same module:

OptionDefaultWhat it does
width1200Image width in pixels.
height630Image height in pixels.
formatpngFormat: png or jpeg.
full_pagefalseSet to true to capture designs taller than the given height.
wait_ms0Wait a few milliseconds before the shot (max 5000).

You can use photos, logos and fonts from the internet by putting their https://… link inside the HTML or CSS. The design is rendered without running JavaScript, so use HTML and CSS.

Prefer to see it in code?

The same call with curl, in case you want to try it on its own:

curl -X POST "https://api.cofferdock.com/capture?width=1200&height=630" \
  -H "x-api-key: YOUR_KEY" \
  -H "Content-Type: text/html" \
  --data-binary "<h1 style='color:#8a5210'>Hello</h1>" \
  -o image.png

How much does it cost?

Each image spends 1 credit from your plan. All Cofferdock tools share the same pool of credits, so you don't buy anything separately.

FAQ

Does Make have a native HTML to image module? No. You do it with the generic HTTP module calling the Cofferdock API, which generates the image.

Do I need to turn on "Parse response"? No. The response is an image (a file), not JSON, so leave it off and map the file to the next module.

Do I need to know how to code? No. You just fill in the HTTP module's fields following this guide.

Can I generate several images at once? Yes. If the previous module returns several items, Make runs the HTTP module once per item.

Try it yourself

You'll find the full instructions, with copy-and-paste examples, on the HTML to image tool page. And if you don't have an account yet, you can create one for free and build your first scenario today.