Skip to content

Latest commit

 

History

History
103 lines (74 loc) · 2.81 KB

index.md

File metadata and controls

103 lines (74 loc) · 2.81 KB
layout title permalink nav_order has_children description
default
Example code
/example-code/
4
true
HTML to Image code examples for Python, PHP, JavaScript, Ruby, Go, C#, TypeScript, and more. Copy-paste ready API integration code.

Example code

{: .no_toc } {: .fs-9 }

To get started quickly, take a look at our example code for generating images. {: .fs-4 .fw-300 }

Live demo{: .btn .btn-primary .fs-5 .mb-4 .mb-md-0 .mr-2 } Get an API Key{: .btn .fs-5 .mb-4 .mb-md-0 }

{% include hint.md title="Using an AI coding assistant?" text="Skip writing code entirely. Connect our MCP Server to generate images directly from Cursor or Claude Code." %}

Works with any programming language

The HTML/CSS to Image API is a simple REST API. If your language can make an HTTP request, it can generate images.

We provide example code for popular languages, but the API works the same way everywhere:

  1. Send a POST request to https://hcti.io/v1/image
  2. Include your HTML/CSS in the request body
  3. Authenticate with HTTP Basic Auth
  4. Receive a JSON response with your image URL

The API request

Here's what a request to the API looks like:

Property Description
Endpoint https://hcti.io/v1/image
Method POST
Content-Type application/json
Authentication HTTP Basic Auth (User ID + API Key)

Request body (JSON)

{
  "html": "<div class='box'>Hello, world!</div>",
  "css": ".box { padding: 20px; background: #03B875; color: white; }"
}

Response

{
  "url": "https://hcti.io/v1/image/be4c5118-fe19-462b-a49e-48cf72697a9d"
}

The returned URL is your generated image. Append .png, .jpg, or .webp to the URL to get different formats.

Quick reference with cURL

The simplest way to test the API:

curl -X POST https://hcti.io/v1/image \
  -u 'your-user-id:your-api-key' \
  -H 'Content-Type: application/json' \
  -d '{"html": "<h1>Hello!</h1>"}'

Available parameters

Parameter Required Description
html Yes* The HTML to render
css No CSS styles for your HTML
url Yes* URL of a webpage to screenshot
google_fonts No Google Fonts to load (comma separated)
ms_delay No Milliseconds to wait before capture
device_scale No Device scale factor (1-3) for retina images
full_screen No Capture the full scrollable page
selector No CSS selector to screenshot a specific element

*Either html or url is required.

For full parameter documentation, see Parameters.

Choose your language

Select your programming language below to see a complete working example: