Getting started
Start here to learn how to use the HTML/CSS to Image API.
Live demo Get an API KeyQuick start in 3 steps
Section titled “Quick start in 3 steps”1. Get your API credentials
Section titled “1. Get your API credentials”Sign up at htmlcsstoimage.com and grab your API ID and API Key from the dashboard.
2. Make your first request
Section titled “2. Make your first request”Choose your approach:
Generate from HTML/CSS:
curl -X POST https://hcti.io/v1/image -u 'API_ID:API_KEY' \ -d html="<div style='padding:20px;background:#4f46e5;color:white;'>Hello World</div>"Screenshot a URL:
curl -X POST https://hcti.io/v1/image -u 'API_ID:API_KEY' \ --data-urlencode url="https://google.com"3. Use your image
Section titled “3. Use your image”The API returns a URL to your generated image. Use it anywhere - in emails, social media, websites, or download it for other uses.
{ "url": "https://hcti.io/v1/image/be4c5118-fe19-462b-a49e-48cf72697a9d", "id": "be4c5118-fe19-462b-a49e-48cf72697a9d"}Choose your path
Section titled “Choose your path”| I want to… | Start here |
|---|---|
| Generate images from HTML/CSS | Using the API |
| Take screenshots of websites | URL to Image |
| Add automatic social cards to a site or CMS | Open Graph Images |
| Create reusable templates | Templates |
| Control image dimensions | Setting Height and Width |
| Design templates visually | Template Editor |
Generate images with a signed GET URL |
Signed Image URLs |
| Manage API keys and organization resources | Management API |
| Set up API credentials and permissions | Authentication and API keys |
Example code
Section titled “Example code”Get started quickly with code samples in your language:
Automation and no-code options
Section titled “Automation and no-code options”Don’t want to write code? We’ve got you covered:
- n8n - Build flexible image-generation workflows
- Zapier - Connect with 5,000+ apps
- Make - Build powerful automation workflows
- MCP Server - Generate images from AI assistants like Cursor, Claude, and more
Need help?
Section titled “Need help?”We’re happy to help you get started. Email us at support@htmlcsstoimage.com - we’re experts at debugging HTML rendering issues and love helping developers succeed.