It's a little more involved than converting a URL to an Image. You need to send Urlbox your HTML and CSS.
First you need to prepare your HTML and CSS. We've added width, height and retina options here so it renders nicely.
{
"html": "<html><head></head><body><h1>Hello World</h1><p>This HTML has been turned into an Image.</p></body></html>",
"css": "body{text-align:center;padding: 10px}",
"width": "500",
"height": "200",
"retina": true
}
All that needs to be URI encoded for Urlbox to process it as a GET request:
https://api.urlbox.io/v1/[API_KEY]/png?html=%3Chtml%3E%3Chead%3E%3C%2Fhead%3E%3Cbody%3E%3Ch1%3EHello%20World%3C%2Fh1%3E%3Cp%3EThis%20HTML%20has%20been%20turned%20into%20an%20Image.%3C%2Fp%3E%3C%2Fbody%3E%3C%2Fhtml%3E&css=body%7Btext-align%3Acenter%3Bpadding%3A%2010px%7D&width=500&height=200&retina=true
Then you can literally create an HTML image tag with that as the src and it will render:
<img src="https://api.urlbox.io/v1/[API_KEY]/png?html=%3Chtml%3E%3Chead%3E%3C%2Fhead%3E%3Cbody%3E%3Ch1%3EHello%20World%3C%2Fh1%3E%3Cp%3EThis%20HTML%20has%20been%20turned%20into%20an%20Image.%3C%2Fp%3E%3C%2Fbody%3E%3C%2Fhtml%3E&css=body%7Btext-align%3Acenter%3Bpadding%3A%2010px%7D&width=500&height=200&retina=true" />
Like this:
There are dozens rendering options in the Urlbox API.
You can even send JavaScript with your HTML and CSS.
Urlbox has many image formats beyond PNG. You can also render:
Urlbox is powerful with dozens of features for taking screenshots at scale.
If you found this useful you might also want to checkout some of our other popular Urlbox features: