Rendshot — Image Generation & Screenshot#

Rendshot renders HTML/CSS to images, takes URL screenshots, and supports AI-powered template generation with platform presets.

Tool Selection#

MCP tools available? Use them directly (preferred path):

ToolUse whengenerate_imageRender HTML, fill a template, or AI-generate from promptscreenshot_urlCapture a webpagelist_templatesBrowse community templates by platform/categoryget_templateGet variable schema before filling a templatecreate_templateSave a design for reuse

No MCP tools? Fall back to CLI or API. See references/api-endpoints.md.

Core Workflows#

1. AI Prompt to Image (fastest)#

text

generate_image({
  prompt: "Coffee shop promotion card, warm brown tones, large title",
  platform: "xiaohongshu",    // auto-sets 1080x1440 + style guide
  locale: "zh"                // response language
})

Combine with template_id to reference an existing template's visual style:

text

generate_image({
  prompt: "Same layout but for a bakery",
  template_id: "tpl_abc123",  // style reference
  platform: "instagram_post"
})

2. Template to Image (deterministic)#

text

// Step 1: Find a template
list_templates({ platform: "xiaohongshu", q: "product showcase" })

// Step 2: Check its variables
get_template({ template_id: "tpl_abc123" })
// Returns: title(text), subtitle(text), bg_image(image), accent_color(color)

// Step 3: Render with custom values
generate_image({
  template_id: "tpl_abc123",
  variables: {
    title: "Today's Special",
    subtitle: "Hand-roasted beans",
    bg_image: "https://example.com/beans.jpg",
    accent_color: "#8B4513"
  }
})

3. Raw HTML to Image#

text

generate_image({
  html: "<div style='...'>Hello World</div>",
  width: 1080,
  height: 1080,
  format: "png",
  deviceScale: 2        // 2x for retina
})

4. Screenshot#

text

screenshot_url({
  url: "https://example.com",
  width: 1280,
  height: 800,
  fullPage: true,
  format: "png"
})

5. Save and Reuse#

After AI generates a design, save it as a template:

text

create_template({
  name: "Coffee Promo Card",
  html: "<returned html from AI>",
  variables: [
    { key: "title", type: "text", label: "Title", default: "Special Offer" },
    { key: "bg_image", type: "image", label: "Background", default: "https://..." }
  ],
  platform: "xiaohongshu",
  tags: ["coffee", "promotion"],
  visibility: "private"
})

Platform Presets#

PlatformDefault sizeTypical usexiaohongshu1080x1440Notes, product cardsxiaohongshu_wide1080x810Wide format notesinstagram_post1080x1080Feed postsinstagram_story1080x1920Stories, reels coverstwitter_card1200x628Link preview cardstwitter_post1200x675Image postslinkedin_post1200x627Professional postsyoutube_thumb1280x720Video thumbnailswechat_cover900x383Article coverswechat_thumb200x200Article thumbnailsog_image1200x630Open Graph imagescustom1080x1080Any custom size

Variable Types#

TypeExampleConstraintstextTitle, subtitlemaxLength``imageBackground, avatarURL formatcolorAccent, backgroundHex formatnumberFont size, opacitymin, max``selectStyle variantoptions: ["A","B"]

Key Rules#

• html, template_id, and prompt are mutually exclusive (except prompt + template_id for style reference)
• Always call get_template before using a template to check its variable schema
• Use deviceScale: 2 for retina/high-DPI output
• Default format is png; use jpg + quality: 85 for smaller file size
• AI prompt mode returns HTML + variables; save good results with create_template
• For detailed tool parameters, see references/mcp-tools.md
• For API/CLI/SDK usage, see references/api-endpoints.md