Generate Social Cards for Every Page

import Rendex from "@copperline/rendex";
import { writeFileSync } from "fs";

const rendex = new Rendex("YOUR_API_KEY");

// Design the card ONCE with {{placeholders}}; render one per page with data.
const template = `<div style="width:100%;height:100%;display:flex;padding:48px;
  background:#0f172a;font-family:system-ui;color:white;">
  <div style="display:flex;flex-direction:column;justify-content:space-between;">
    <div style="font-size:16px;color:#94a3b8;">{{category}}</div>
    <h1 style="font-size:48px;margin:0;line-height:1.2;">{{title}}</h1>
    <div style="font-size:18px;color:#94a3b8;">{{author}} · {{date}}</div>
  </div>
</div>`;

const { image } = await rendex.screenshot({
  html: template,
  data: { category: "Blog Post", title: "Edge Rendering 101", author: "Dana Okafor", date: "May 26, 2026" },
  format: "png",
  width: 1200,
  height: 630,
});
writeFileSync("card.png", Buffer.from(image));

// One template, every network's required size — change only width/height.
const platforms = [
  { name: "landscape", width: 1200, height: 630 },  // Twitter, LinkedIn, Facebook
  { name: "square",    width: 1200, height: 1200 }, // Instagram feed
  { name: "story",     width: 1080, height: 1920 }, // Instagram / TikTok story
];

const data = { category: "Blog Post", title: post.title, author: post.author, date: post.date };

for (const p of platforms) {
  const { image } = await rendex.screenshot({
    html: template,             // the SAME {{...}} template as above
    data,
    format: "png",
    width: p.width,
    height: p.height,
  });
  writeFileSync(`card-${p.name}.png`, Buffer.from(image));
}

from rendex import Rendex
from pathlib import Path

rendex = Rendex("YOUR_API_KEY")

# Render the same card at each platform's dimensions.
data = {"category": "Blog Post", "title": post.title, "author": post.author, "date": post.date}

for name, w, h in [("landscape", 1200, 630), ("square", 1200, 1200), ("story", 1080, 1920)]:
    result = rendex.screenshot(html=template, data=data, format="png", width=w, height=h)
    Path(f"card-{name}.png").write_bytes(result.image)