@snap-x/core

Branded graphics for every platform, made by your AI agent.

The engine behind snap-x: renders a self-contained Satori .mjs design file to PNG. No browser, no config.

Want the command? Use @snap-x/cli: npx @snap-x/cli render designs/*.mjs.

This package is the library:

import { renderDesign, checkDesign, resolveFonts, collectFontsSpec } from "@snap-x/core";

const files = ["designs/og.mjs"];
const fonts = await resolveFonts(await collectFontsSpec(files));
await renderDesign(files[0], "snap-output", fonts);
await renderDesign(files[0], "snap-output", fonts, { scale: 2 }); // sharp @2x → [email protected]

renderPool(files, outDir, fonts, { jobs, onResult }) renders several files concurrently in a small worker_threads pool (default: your CPU count; jobs: 1 renders sequentially, same as calling renderDesign in a loop). onResult(index, result) fires once per file, always in files' original order regardless of which finishes first.

A design file exports FORMAT, optionally FONTS, and a zero-argument default export (a Satori tree, or a function returning one). .mjs, .jsx and .tsx all work — JSX/TSX are transformed at load time (esbuild, no React).

export const FORMAT = { width: 1200, height: 630, name: "og.png" };
export const FONTS  = [{ family: "Inter", weights: [400, 700, 900] }]; // optional

export default function () {
  return { type: "div", props: { style: { width: 1200, height: 630, background: "#000", display: "flex" }, children: [] } };
}

Fonts are fetched from Google Fonts and cached on disk; non-Latin scripts get automatic fallback fonts.

Full docs: https://github.com/ravikovind/snap-x#readme