Skip to content
HTML/CSS to ImageDocs

Generate PNG, JPG, WebP, and PDF output with PHP, using HTML/CSS or reusable templates rendered in Google Chrome.

Generating images with PHP

  1. Send your HTML/CSS to the API.
  2. The API renders it in Google Chrome.
  3. Read the generated image URL from the JSON response.

See Creating an image for request parameters. A response includes the image's url and id.

Example image generated from HTML with PHP

Authentication with PHP

Use HTTP Basic authentication with your API ID as the username and API key as the password. Find both in the dashboard. Keep credentials in server-side configuration or environment variables.

PHP example code

The example sends a POST request to https://hcti.io/v1/image. Image creation requires images:create. See authentication and API keys for scoped credentials and access errors.

For typed requests, responses, and signed URL helpers, use the official html-css-to-image/client package.

Terminal window
composer require html-css-to-image/client
<?php
use HtmlCssToImage\HtmlCssToImageClient;
use HtmlCssToImage\Request\CreateHtmlCssImageRequest;
use HtmlCssToImage\Response\CreateImageSuccessResponse;
require __DIR__ . '/vendor/autoload.php';
$client = new HtmlCssToImageClient(
apiId: 'your-api-id',
apiKey: 'your-api-key',
);
$result = $client->createImage(
new CreateHtmlCssImageRequest(
html: "<div class='box'>PHP ✅</div>",
css: '.box { border: 4px solid #03B875; padding: 20px; }',
),
);
if ($result instanceof CreateImageSuccessResponse) {
echo $result->url;
} else {
echo $result->error;
}

The client also supports URL screenshots, templates, batches, image deletion, render options, and signed URLs. See the PHP client repository for complete usage and API documentation.

<?php
$ch = curl_init('https://hcti.io/v1/image');
curl_setopt_array($ch, [
CURLOPT_RETURNTRANSFER => true,
CURLOPT_POST => true,
CURLOPT_USERPWD => 'your-api-id:your-api-key',
CURLOPT_POSTFIELDS => http_build_query([
'html' => "<div class='ping'>Pong ✅</div>",
'css' => '.ping { padding: 20px; font-family: sans-serif; }',
]),
]);
$body = curl_exec($ch);
if ($body === false) {
throw new RuntimeException(curl_error($ch));
}
$status = curl_getinfo($ch, CURLINFO_HTTP_CODE);
curl_close($ch);
if ($status < 200 || $status >= 300) {
throw new RuntimeException("API request failed ($status): $body");
}
echo json_decode($body, true, 512, JSON_THROW_ON_ERROR)['url'];

Using an HTTP library such as Guzzle can simplify your code even further. Here’s an example of how to use the HTML/CSS to Image API with Guzzle.

Installation instructions for Guzzle are here.

<?php
require 'vendor/autoload.php';
$html = "<div class='ping'>Pong ✅</div>";
$css = ".ping { padding: 20px; font-family: 'sans-serif'; }";
$client = new \GuzzleHttp\Client();
// Retrieve your user_id and api_key from https://htmlcsstoimage.com/dashboard
$res = $client->request('POST', 'https://hcti.io/v1/image', [
'auth' => ['user_id', 'api_key'],
'form_params' => ['html' => $html, 'css' => $css]
]);
echo $res->getBody();
// {"url":"https://hcti.io/v1/image/5803a3f0-abd3-4f56-9e6c-3823d7466ed6"}
?>

The code turns out to be a bit more readable and less complex when using Guzzle. A great option if you’re open to adding the library to your project.

Debugging Error:SSL certificate problem: unable to get local issuer certificate

Section titled “Debugging Error:SSL certificate problem: unable to get local issuer certificate”

When running this script on a Windows machine, it’s possible you’ll get an SSL error. The fix for this is here.

Need help?

Talk to a human. Email support@htmlcsstoimage.com and we’ll help you get started.