Takumi

Turn JSX into production-ready images fast.
OG cards, banners, and lightweight animations from one Rust engine for Node.js and WebAssembly.

Docs · Playground

Takumi is inspired by satori, with a stronger focus on portability and performance.

Why teams pick Takumi

• One-pass rendering with no SVG-to-image two-step pipeline.
• JSX in, pixels out with cross-runtime delivery.
• Node native speed with WASM fallback for edge and browser workers.
• Production text stack: variable fonts, COLR, WOFF2, and RTL.
• Rich output formats: WebP/PNG/JPEG/APNG or FFmpeg pipelines.

Performance

In Image Bench, Takumi is typically 2-10x faster than next/og. See benchmark runs and templates on Image Bench.

First render in 30 seconds

npm i @takumi-rs/image-response

import { ImageResponse } from "@takumi-rs/image-response";

export function GET() {
  return new ImageResponse(
    <div tw="w-full h-full flex items-center justify-center bg-white">
      <h1 tw="text-6xl font-bold">Hello from Takumi</h1>
    </div>,
    {
      width: 1200,
      height: 630,
      format: "webp",
    },
  );
}

For runtime-specific setup (Next.js, Vite SSR, Nitro, Cloudflare, Turbopack), see Docs.

What you can build

• Open Graph and social cards
• Blog covers and marketing banners
• JSX-powered dynamic snapshots
• Component-based motion graphics

Showcase

• Takumi OG image (source)

  

• Prisma-style API card (source)

  

• X-style social post (source)

  

• shiki-image: code snippet images

  

• (Unofficial) Takumi Playground

Note

Showcase submissions are welcome via PR to showcase.ts.

Contributing

PRs are welcome. See CONTRIBUTING.md for setup, tests, fixtures, and changesets. By participating, you agree to the Code of Conduct.

Credits

Takumi builds on excellent OSS: taffy, image, parley, swash, wuff, resvg.

License

Licensed under either of:

• Apache License, Version 2.0
• MIT license