@dloizides/og-image-generator

Provider-agnostic build-time image generation — rasterise brand SVGs into PNG social cards (OG) and icons. This is the image seam of the cross-product generation abstraction (Capability Wave C3): consumers depend on the ImageRasterizer interface, never on a specific backend, so the rendering engine (today sharp, tomorrow a self-host/AI provider) is swappable without code change.

Why

Every site that ships an Open Graph card and an apple-touch-icon needs the same build step: take an SVG design source and emit a sized PNG. Instead of copy-pasting a sharp script into each repo, depend on this package and pass the jobs in.

Install

npm i -D @dloizides/og-image-generator sharp

sharp is injected, not a dependency of this package — you control its version and the package itself has zero runtime deps.

Use (build script)

import sharp from 'sharp';
import { resolve, dirname } from 'node:path';
import { fileURLToPath } from 'node:url';
import {
  SharpRasterizer,
  generateOgImages,
  nodeFileSystem,
} from '@dloizides/og-image-generator';

const root = resolve(dirname(fileURLToPath(import.meta.url)), '..');
const p = (rel) => resolve(root, rel);

await generateOgImages(
  [
    { src: p('public/og-card.svg'), dst: p('public/og-card.png'), width: 1200, height: 630, fit: 'cover' },
    { src: p('public/favicon.svg'), dst: p('public/apple-touch-icon.png'), width: 180, height: 180, fit: 'contain' },
  ],
  { rasterizer: new SharpRasterizer(sharp), fs: nodeFileSystem, logger: console },
);

Missing sources are skipped with a warning (written: false), so a site without a favicon SVG still builds.

API

• ImageRasterizer — the seam: rasterize(source: Buffer, opts): Promise<Buffer>.
• SharpRasterizer — build-time provider; new SharpRasterizer(sharp).
• generateOgImages(jobs, { rasterizer, fs, logger? }) — orchestrates read → rasterize → write per job (sequential; missing sources skipped).
• nodeFileSystem — default node:fs filesystem port.
• Defaults — fit: 'cover', density: 144, quality: 90.

Adding a provider

Implement ImageRasterizer (e.g. a self-host ComfyUI or an AI image API) and pass it to generateOgImages — no consumer change. The build-time sharp path stays the default for deterministic, dependency-light asset rendering.