| description |
|---|
Convert HTML to an image (jpg, png, webp). Renders images exactly like Google Chrome. |
Welcome to the API docs! To get started, we recommend taking a look at one of our code samples.
Don't want to write code? That's OK! We also integrate with Zapier and Integromat.
{% page-ref page="example-code/ruby.md" %}
{% page-ref page="example-code/php.md" %}
{% page-ref page="getting-started/zapier-integration.md" %}
{% page-ref page="example-code/javascript.md" %}
{% page-ref page="example-code/c.md" %}
{% page-ref page="example-code/vb.net.md" %}
{% page-ref page="example-code/go.md" %}
{% page-ref page="example-code/curl.md" %}
{% page-ref page="example-code/python.md" %}
{% page-ref page="getting-started/integromat-integration.md" %}
Your favorite language not here? Sorry about that! Don't worry, we work with any language or framework. See the curl example for how to make a request. Email us if you need help getting started. We'd love to add more example code here.
Your imagination is the only limit. We render HTML/CSS just like Google Chrome. Here are a few examples of ways people have used the API to automate their image generation.
Dev.to uses the API to autogenerate thousands of custom images for Twitter and Facebook.
To see how they do it, take a look at their code (it's open source!).
Product Hunt uses HTML/CSS to Image to dynamically generate social cards for Maker Goals.
Source code for this example on CodePen.
Source code for this example on CodePen.
Generate images from your users comments. Add the ability to highlight and share.
Source code for this example on CodePen.
Generate images from job listings for sharing in emails, ads or social media.
Source code for this example on CodePen.
Pass an entire webpage to the API to generate a full page screenshot. Here we passed stripe.com's homepage HTML to the API.
{% hint style="info" %}
When rendering an entire page, be sure to include all of the markup. Including the <html> tags. All external assets (css, javascript, images) must be loaded using a full URL. Relative paths will not work.
{% endhint %}
Once an image is generated, use our API to adjust the image to any size you need with the width and height params. When only one param is passed, the API will maintain the aspect ratio of the original image.
?width=400
?width=400&height=400
?height=300
To use this API, you'll first need an API key. You may retrieve one by signing up here.
Now that you have an API key, get started creating your first image.
{% page-ref page="getting-started/creating-an-image.md" %}
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent