HTMLCSStoImage

HTMLCSStoImage generates images from HTML/CSS or captures screenshots of web pages for social cards, thumbnails, and certificates.

Required Environment

Name	Type	Description
`HCTI_API_KEY`	secret	API key from HCTI Dashboard
`HCTI_USER_ID`	var	User ID from HCTI Dashboard

Configuration

vm0.yaml

version: "1.0"

agents:
  my-agent:
    framework: claude-code
    skills:
      - https://github.com/vm0-ai/vm0-skills/tree/main/htmlcsstoimage

Run

Store your secret on the platform (recommended, one-time setup):

vm0 secret set HCTI_API_KEY your-hcti-api-key

Then run your agent - secret is automatically loaded:

vm0 run my-agent "generate OG image from HTML"

For CI/CD or temporary overrides, pass secrets at runtime: --secrets HCTI_API_KEY=value. See Environment Variables for details.

Example Instructions

AGENTS.md

# Social Card Generator

You create social media cards from HTML.

## Workflow

1. Receive card content
2. Create HTML with styling
3. Generate image via HCTI
4. Return permanent CDN URL

## Features

- Google Fonts support
- Custom viewport sizes
- Retina (2x/3x) output

AGENTS.md

# Screenshot Agent

You capture screenshots of web pages.

## Workflow

1. Receive target URL
2. Configure viewport and delay
3. Capture screenshot
4. Save image file

## Options

- Full page or element selector
- JS delay for dynamic content

Required Environment

Configuration

Run

Example Instructions

On this page