Assets

Open Graph Images

Install: npm install @better-seo/assets

import { generateOG } from "@better-seo/assets"
import { writeFile } from "node:fs/promises"

const png = await generateOG({
  title: "Hello World",
  siteName: "My Site",
  description: "Optional subtitle",
  theme: "dark", // "light" | "dark" | "auto"
  // logo: "./public/logo.png" or "https://…"
})
await writeFile("./public/og.png", png)

Output: 1200×630 PNG. Built-in light/dark card templates. Custom templates via --template ./my-card.mjs (compiled ESM, OgCardProps).

CLI: npx @better-seo/cli og "Hello World" -o ./public/og.png --site-name "Brand"

Icons & Favicon Set

npx @better-seo/cli icons --input ./logo.png --out ./public

Generates:

• favicon.ico (16×16, 32×32)
• PNG set: 16, 32, 48, 96, 128, 256, 512
• apple-touch-icon.png (180×180)
• maskable-icon-512.png
• Optional manifest.json (PWA web app manifest)

Splash Screens

iOS / iPadOS splash screen sizes for PWA install prompts. Generated via @better-seo/assets generateSplash.

Design System Hooks

Optional Tailwind token parsing for OG card theming. Graceful fallback + warnings if tokens are missing.

Next

• OG recipe — detailed setup guide
• Icons recipe — full size matrix + manifest