JavaScript SDK — HTML to Image in Node.js

npm install @rendshot/sdk

import { RendshotClient } from '@rendshot/sdk'

const client = new RendshotClient({
  apiKey: 'rs_live_YOUR_KEY',
  baseUrl: 'https://api.rendshot.ai', // optional
})

const result = await client.renderImage({
  html: '<div style="padding:40px;background:#1a1a2e;color:#fff"><h1>Hello</h1></div>',
  css: 'h1 { font-size: 48px; }',
  width: 1200,
  height: 630,
  format: 'png',
  quality: 90,
  deviceScale: 2,
  fonts: ['Inter'],
  timeout: 10000,
})

console.log(result.imageId) // image id
console.log(result.url)     // https://assets.rendshot.ai/...

// 1. Discover available templates
const { templates } = await client.listTemplates({ limit: 10 })

// 2. Inspect a template's variables
const template = await client.getTemplate('tpl_abc123')
console.log(template.name)      // "Social Card"
console.log(template.variables)  // [{ key: 'title', type: 'text', ... }]

// 3. Render with variables
const result = await client.renderImage({
  template_id: 'tpl_abc123',
  variables: {
    title: 'Hello World',
    bgColor: '#6B8F5E',
  },
})

console.log(result.url)

const result = await client.aiRender({
  prompt: 'Social card announcing a product launch, minimal layout',
  platform: 'twitter_card',   // optional preset
  templateId: 'tpl_abc123',   // optional: use existing template as style reference
  width: 1200,
  height: 630,
  format: 'png',
  locale: 'en',                // 'zh' | 'en'
})

console.log(result.url)        // rendered image URL
console.log(result.html)       // AI-generated template HTML with {{placeholders}}
console.log(result.variables)  // AI-generated variable definitions

const result = await client.aiRender({
  prompt: 'Minimal weekly digest cover',
  platform: 'xiaohongshu',
})

const tpl = await client.createTemplate({
  name: 'Weekly Digest',
  html: result.html,
  variables: result.variables,
  platform: 'xiaohongshu',
  width: result.width,
  height: result.height,
  // visibility defaults to 'private'
})

console.log(tpl.id)  // "tpl_xyz789" — use this for fast, deterministic re-renders

const tpl = await client.createTemplate({
  name: 'Launch Card',
  html: '<div class="card"><h1>{{title}}</h1></div>',
  variables: [
    { key: 'title', type: 'text', label: 'Title', default: 'Hello' },
  ],
  platform: 'twitter_card',
  description: 'Marketing launch card',
  tags: ['marketing', 'launch'],
  // visibility: 'private' by default — publish from the web dashboard
})

console.log(tpl.id)           // "tpl_abc123"
console.log(tpl.status)       // "draft"
console.log(tpl.visibility)   // "private"

const result = await client.screenshotUrl({
  url: 'https://example.com',
  width: 1280,
  height: 800,
  format: 'png',
  quality: 90,
  fullPage: false,
  deviceScale: 2,
  timeout: 15000,
})

console.log(result.url)

const usage = await client.getUsage()

console.log(usage.plan)  // "free" | "pro"
console.log(usage.month) // "2026-03"
console.log(usage.count) // 42
console.log(usage.limit) // 100

const image = await client.getImage('img_abc123')

console.log(image.id)        // "img_abc123"
console.log(image.url)       // "https://assets.rendshot.ai/..."
console.log(image.expiresAt) // "2027-04-22T00:00:00Z"

import { RendshotClient, RendshotError } from '@rendshot/sdk'

const client = new RendshotClient({ apiKey: 'rs_live_YOUR_KEY' })

try {
  await client.renderImage({ html: '<h1>Hello</h1>' })
} catch (err) {
  if (err instanceof RendshotError) {
    console.error(err.code)    // e.g. "RATE_LIMIT_EXCEEDED"
    console.error(err.status)  // e.g. 429
    console.error(err.message) // e.g. "Rate limit exceeded"
  }
}