---
canonical: 'https://htmlcsstoimage.com/features/html-to-png/php'
title: 'Convert HTML to PNG in PHP | HTML/CSS to Image'
description: 'Convert HTML and CSS to PNG in PHP. Generate a hosted .png image URL.'
---

# Generate PNG images in PHP without managing Chrome

Render HTML and CSS from PHP without installing Chrome, running a PHP headless-browser wrapper, or building a separate image-storage pipeline.

## Why use the API instead of native PHP browser automation?

- Avoid provisioning Chrome and long-running browser processes in PHP web or queue workers.
- Use managed browser versions, isolated render jobs, timing controls, and consistent viewport behavior across deployments.
- Receive a hosted .png URL without building a separate pipeline for temporary files, uploads, storage, and delivery.

## Complete PHP request

Use this request to render the example HTML and CSS as PNG.

```php
<?php

$request = [
    "html" => <<<'HCTI_HTML'
              <div class="card">
                <h1>Hello, world!</h1>
                <p>Generated from HTML and CSS.</p>
              </div>
              HCTI_HTML,
    "css" => <<<'HCTI_CSS'
             .card {
               width: 480px;
               padding: 40px;
               background: #f0fdf4;
               color: #052e16;
               font-family: sans-serif;
             }
             HCTI_CSS,
    "format" => "png",
];

$curl = curl_init("https://hcti.io/v1/image");
curl_setopt_array($curl, [
    CURLOPT_POST => true,
    CURLOPT_USERPWD => sprintf("%s:%s", getenv("HCTI_API_ID"), getenv("HCTI_API_KEY")),
    CURLOPT_HTTPHEADER => ["Content-Type: application/json"],
    CURLOPT_POSTFIELDS => json_encode($request, JSON_THROW_ON_ERROR),
    CURLOPT_RETURNTRANSFER => true,
]);

$response = curl_exec($curl);
if ($response === false) {
    throw new RuntimeException(curl_error($curl));
}
$status = curl_getinfo($curl, CURLINFO_RESPONSE_CODE);
curl_close($curl);
if ($status >= 400) {
    throw new RuntimeException(sprintf("HCTI request failed (%d): %s", $status, $response));
}

$result = json_decode($response, true, 512, JSON_THROW_ON_ERROR);
printf("%s\n", $result["url"]);

```

## When to use PNG

PNG preserves sharp edges, text, and transparency, making it ideal for interface captures and designed graphics.

- **Lossless detail**: Keep text, icons, charts, and interface elements crisp without compression artifacts.
- **Transparent backgrounds**: Preserve transparent HTML backgrounds for overlays, product graphics, badges, and reusable assets.
- **Reliable visual fidelity**: Use PNG when exact colors and sharp edges matter more than achieving the smallest possible file.

## API request

Send an authenticated `POST` request to `https://hcti.io/v1/image`. Include `html`, optional `css`, `format`, and any viewport or browser options required by the render.

```json
{
  "html": "\u003Carticle class=\u0027card\u0027\u003E...\u003C/article\u003E",
  "css": ".card { display: grid; width: 1200px; }",
  "format": "png",
  "viewport_width": 1200,
  "viewport_height": 630
}
```

## Request workflow

1. **Send HTML and CSS** — Submit the content with format set to png and any viewport or browser settings.
2. **Chromium renders the design** — The API loads the markup, styles, fonts, and assets in a managed browser environment.
3. **Use the .png URL** — Embed the hosted result, download the file, or save it in your own storage and application records.

## Authentication and output handling

- Authenticate from trusted server-side code. Do not expose an API key in browser JavaScript, generated HTML, logs, or agent-visible output.
- Treat the returned URL as the generated `png` resource. Download it, embed it, or copy it to configured storage as required by the workflow.
- Use viewport, selector, timing, and browser options when the default capture does not match the required dimensions or page state.
- If credentials are unavailable, ask the user to configure them securely before attempting an API request.

## Use through MCP

An MCP-compatible agent can connect to `https://mcp.hcti.io` with OAuth and use the connected HTML/CSS to Image account instead of handling an API key directly.

Ask the MCP tool to render the supplied HTML and CSS as PNG, or specify `format: png` explicitly when constructing the request.

- [Read the MCP integration documentation](https://docs.htmlcsstoimage.com/integrations/mcp/)

## Related conversions

- [URL to PNG](https://htmlcsstoimage.com/features/url-to-png/php.md): Capture a public webpage as PNG instead of supplying HTML and CSS.
- [HTML to JPEG](https://htmlcsstoimage.com/features/html-to-jpeg/php.md): JPEG is a practical choice for photographic and content-rich images where broad compatibility and smaller files matter.
- [HTML to WebP](https://htmlcsstoimage.com/features/html-to-webp/php.md): WebP combines modern compression with high visual quality, making it a strong default for images delivered on the web.
- [HTML to PDF](https://htmlcsstoimage.com/features/html-to-pdf.md): Generate paginated documents with page sizing, margins, backgrounds, and print styles.

## Reference links

- [API authentication and request documentation](https://docs.htmlcsstoimage.com/getting-started/using-the-api/)
- [MCP integration documentation](https://docs.htmlcsstoimage.com/integrations/mcp/)
- [Interactive HTML to PNG page](https://htmlcsstoimage.com/features/html-to-png/php)
- [Plans and current limits](https://htmlcsstoimage.com/pricing.md)