Render your Reactcomponents to images.

Rust-powered image rendering engine. Write JSX, get pixels.
2–10× faster than next/og. Runs everywhere.

Get Started Open Playground

2–10×Faster than next/og

140+Supported CSS properties

1K+GitHub stars

Bring Existing Code

JSX in. Image out.

Write standard React components with CSS styling. Takumi renders them into production-quality images at blazing speed.

route.tsx

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

export async function GET() {
  return new ImageResponse(
    <div
      style={{
        display: "flex",
        background: "linear-gradient(135deg, #0a0a0a, #1a0a0a)",
        color: "white",
        padding: 48,
        width: "100%",
        height: "100%",
        fontFamily: "Geist",
      }}
    >
      <h1 style={{ fontSize: 64 }}>
        Hello, Takumi ✌️
      </h1>
    </div>,
  );
}