Read this article in English.

HTML a imagen en n8n: guía paso a paso y plantilla gratis

Actualizado el 13 de octubre de 2026

Respuesta corta: n8n no trae un nodo de "HTML a imagen". Añade un nodo HTTP Request que envíe tu HTML (POST) a una API que lo pinte, pon Response Format en File y el nodo te devuelve la imagen PNG, JPEG o WebP en la propiedad binaria data. Sirve en n8n Cloud y autoalojado, sin instalar ningún nodo de la comunidad.

Si automatizas con n8n, tarde o temprano necesitas crear una imagen dentro de un flujo: una tarjeta para redes, la imagen de Open Graph de un artículo, un recibo, un certificado o una miniatura. No hace falta montar un servidor, instalar un navegador ni buscar nodos de la comunidad. Basta un nodo HTTP Request llamando a la API de Cofferdock, y aquí lo tienes campo a campo.

Ese único nodo devuelve ya el archivo de imagen, listo para Google Drive, Gmail, Slack o Telegram.

Esta es la imagen real que devuelve el flujo de abajo, generada por n8n a partir de unas líneas de HTML:

Lo más rápido: importa el flujo ya hecho

Si prefieres no rellenar campos a mano, empieza por el flujo gratis:

1. En n8n, crea un flujo nuevo y abre el menú ⋯ (arriba a la derecha) → Import from URL.
2. Pega este enlace: https://cofferdock.com/static/blog/n8n/html-to-image.json
3. Abre el nodo HTML to image y cambia YOUR_API_KEY por tu llave.
4. Pulsa Test workflow. El último nodo devuelve el PNG como archivo.

También puedes descargar el archivo del flujo y usar Import from File, o abrirlo, copiarlo entero y pegarlo en el lienzo de n8n con Ctrl+V.

Lo que necesitas

• Una cuenta en Cofferdock. El plan gratis te da 50 créditos al mes sin tarjeta, de sobra para probar.
• Tu API key, que creas en tu panel con "+ Crear llave". Se muestra una sola vez, así que cópiala y guárdala.
• Un nodo HTTP Request en tu flujo de n8n.

Paso a paso en el nodo HTTP Request

Añade un nodo HTTP Request y rellénalo así:

• Method: POST
• URL: https://api.cofferdock.com/capture
• Send Query Parameters: actívalo y añade el tamaño en campos separados: width = 1200 y height = 630.
• Send Headers: actívalo y añade dos cabeceras: x-api-key con tu llave, y Content-Type con el valor text/html.
• Send Body: actívalo → Body Content Type Raw → Content Type text/html → en Body pega tu HTML.
• En Options → Response → Response Format elige File.

Y ya está. La salida del nodo es un archivo binario en la propiedad data. Para adjuntarlo en Gmail, añade un adjunto y escribe data; en Google Drive → Upload, el campo del archivo también es data.

Mete datos de nodos anteriores en la imagen

La gracia es que la imagen cambie con tus datos. Pon el campo Body en modo Expression y mete valores de los nodos anteriores en tu HTML:

<div style="width:1200px;height:630px;background:#1f1a17;color:#fff;font-family:Arial;padding:80px;box-sizing:border-box">
  <h1 style="font-size:72px">{{ $json.titulo }}</h1>
  <p style="font-size:34px">{{ $json.autor }}</p>
</div>

Si el nodo anterior devuelve diez filas, el HTTP Request se ejecuta diez veces y obtienes diez imágenes distintas. Un flujo típico:

1. Google Sheets (o un webhook, Airtable, Notion…) lee las filas.
2. HTTP Request convierte cada fila en imagen con las expresiones de arriba.
3. Google Drive guarda cada imagen, o Gmail la envía.

Sin escribir HTML: usa una plantilla

Si no quieres escribir HTML, manda el nombre de una plantilla y tus textos en JSON. Cambia estos campos en el mismo nodo:

• Body Content Type: JSON → Specify Body: Using JSON
• JSON:

{
  "template": "social",
  "data": { "quote": "Automatiza lo aburrido", "author": "Tu nombre", "brand": "tumarca.com" },
  "lang": "es",
  "output": "image"
}

Quita la cabecera Content-Type: text/html (n8n manda la de JSON por su cuenta). Las plantillas disponibles (social, og, youtube, receipt, certificate, invoice) y sus campos están en cofferdock.com/templates.json, y puedes ver los diseños en la página de plantillas. Todo lo que mandas se escapa, así que los datos de un formulario no pueden romper el diseño.

Opciones que puedes ajustar

Se añaden como Query Parameters en el mismo nodo:

Las fotos de fondo, logos y tipografías web funcionan poniendo su enlace https://… dentro del HTML o del CSS. La página se pinta sin ejecutar JavaScript, así que monta el diseño solo con HTML y CSS.

Errores típicos y cómo arreglarlos

¿Prefieres verlo en código?

La misma llamada con curl, para probarla fuera de n8n:

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

Otras formas de hacerlo en n8n

El nodo HTTP Request no es la única vía. Así se comparan las opciones:

Si estás en n8n Cloud, o simplemente no quieres mantener nada, la vía del nodo HTTP Request de arriba es la más sencilla.

¿Cuánto cuesta?

Cada imagen gasta 1 crédito. Todas las herramientas de Cofferdock (HTML a PDF, capturas de webs, QR, gráficos, herramientas de PDF…) tiran del mismo bote de créditos, así que con una suscripción tienes todas.

Preguntas frecuentes

¿n8n tiene un nodo nativo de HTML a imagen? No. Se hace con el nodo HTTP Request llamando a la API de Cofferdock, que es la que genera la imagen.

¿Necesito saber programar? No. Importa el flujo o rellena los campos del nodo siguiendo esta guía. El HTML puede salir de una plantilla.

¿Qué recibo, un enlace o el archivo? El archivo, en la propiedad binaria data. Si prefieres un enlace (para mandarlo por Slack o guardarlo en una hoja), añade output = url.

¿Puedo generar imágenes en bucle? Sí. Si el nodo anterior devuelve varios elementos, n8n ejecuta el HTTP Request una vez por cada uno y obtienes una imagen por elemento.

¿Lo puede usar un agente de IA de n8n? Sí. Conecta el mismo nodo HTTP Request como herramienta del AI Agent, o usa el servidor MCP que se explica en la página de asistentes de IA.

¿Funciona en n8n Cloud? Sí. El nodo HTTP Request es parte de n8n, así que funciona en n8n Cloud y en instalaciones propias, y no instalas nada.

¿Puedo convertir una página web en imagen en vez de escribir HTML? Sí. La herramienta de captura de webs recibe una URL en lugar de HTML, y el montaje en n8n es casi idéntico. Mira captura de webs en n8n.

¿Se guardan mi HTML y las imágenes? No. Se procesan en memoria y se descartan. Solo si pides output = url, la imagen se guarda 15 minutos para que puedas descargarla.

¿Hay un límite de tamaño? El HTML puede pesar hasta 5 MB y la imagen medir hasta 3840 × 2160 píxeles.

Guías relacionadas

• HTML a imagen en Make y en Zapier
• HTML a PDF en n8n (facturas e informes)
• Captura de webs en n8n
• QR en n8n y gráficos en n8n
• Alternativa a htmlcsstoimage: cuándo te conviene Cofferdock y cuándo no

Referencia completa con todas las opciones: API de HTML a imagen. ¿Aún sin cuenta? Crea una gratis y monta tu primer flujo hoy mismo.