HTML to PDF in Next.js

Send HTML (or a URL) to the FrameForge API and get a PDF back. It is rendered in real Chromium, so modern CSS, web fonts and JavaScript all work. No browser to install or babysit.

The code

Next.js App Router route handler. Set FRAMEFORGE_KEY to your API key.

// app/api/invoice/[id]/route.ts
export async function GET(_req: Request, { params }: { params: Promise<{ id: string }> }) {
  const { id } = await params;
  const html = `<h1>Invoice #${id}</h1><p>Total: £49.00</p>`; // build from your DB

  const res = await fetch("https://api.frameforgeapi.com/render", {
    method: "POST",
    headers: { "Content-Type": "application/json", "X-API-Key": process.env.FRAMEFORGE_KEY! },
    body: JSON.stringify({ html, format: "pdf", width: 794, height: 1123 }),
  });
  if (!res.ok) return new Response("Render failed", { status: 502 });

  return new Response(res.body, {
    headers: {
      "Content-Type": "application/pdf",
      "Content-Disposition": `inline; filename="invoice-${id}.pdf"`,
    },
  });
}

How it works

• POST /render takes JSON with exactly one of html (up to 1 MiB) or url, plus format (png, jpeg or pdf), width and height (1 to 3840 px) and fullPage.
• The response body is the file itself (application/pdf), not JSON, so write the bytes straight to disk or stream them to the user.
• Page size: the PDF page is width × height pixels. 794 × 1123 is A4 at 96 DPI and 816 × 1056 is US Letter. Content longer than one page flows onto more pages of the same size. With fullPage: true you get one tall page instead.
• Margins: pages have no printer margins, so add padding in your HTML (for example body { padding: 48px }).
• Caching: identical requests within 24 hours are served from cache and don't count against your quota. Check the X-FrameForge-Cache response header.
• Errors come back as JSON with an error code: 401 bad key, 429 rate limited, 400 blocked_url for private or local addresses.

Rendering a URL instead of HTML

{"url": "https://example.com/report", "format": "pdf", "width": 1280, "height": 800, "fullPage": true}

Doing it yourself instead

Running Chromium inside serverless functions is possible with trimmed builds, but it is fragile: bundle size limits, cold starts and memory caps are the usual pain points, and they are why people use an API.

An API makes sense when you don't want Chromium on your servers, or when you need images (PNG/JPEG) and PDFs from the same call. If you render a few PDFs a month on a server you already run, self-hosting is perfectly reasonable.

Free tool: Website to PDF. Other languages: Node.js · Python · PHP · Ruby · Go · Java · C# / .NET · curl / Bash · Laravel · Django · Ruby on Rails