render_html_to_image
Render HTML and CSS into a PNG, JPEG, or WebP image using saved templates with placeholders or raw HTML. Get the image inline for direct display in conversations.
Instructions
Render HTML (and optional CSS) into a PNG/JPEG/WebP image using codetoimage.app. Instead of raw HTML you can pass template_id (a template saved in the dashboard) plus variables to fill its {{placeholders}}, and preset for named platform sizes (og, instagram-story, ...). Returns the image inline so the conversation can display it directly. Use this when you need to see or hand back a finished image (cards, OG previews, charts, badges). If the caller needs a URL to embed elsewhere (Instagram Graph API, OpenGraph meta, Slack unfurl), use render_html_to_url instead.
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| css | No | Optional CSS injected as a <style> block. | |
| html | No | Full HTML (typically including <body>…</body>). Inline styles work; for larger CSS use the `css` field. Required unless `template_id` is provided. | |
| width | No | Viewport width in pixels (default 800). | |
| format | No | Output format. Default: png. | |
| height | No | Viewport height in pixels (default 600). | |
| preset | No | Named viewport size: og 1200×630, twitter-card 1200×628, facebook-post 1200×630, linkedin-post 1200×627, instagram-square 1080×1080, instagram-portrait 1080×1350, instagram-story 1080×1920, youtube-thumbnail 1280×720, pinterest-pin 1000×1500. One template, many sizes. Explicit width/height override the preset. | |
| quality | No | Encoder quality (JPEG/WebP only, 1-100). | |
| variables | No | Values for {{placeholders}} in the template (or in `html` if provided). Values are HTML-escaped server-side. Missing placeholders render as empty. | |
| background | No | Background color, e.g. '#ffffff' or 'rgb(10,10,10)'. | |
| template_id | No | ID of a template saved in the codetoimage dashboard (Templates page). Use INSTEAD of `html` – the saved HTML/CSS renders with {{placeholders}} filled from `variables`. | |
| transparent | No | Transparent background (PNG/WebP only; paid plans). |