# @json-render/react-pdf

> Render structured JSON specifications into PDFs using React PDF

@json-render/react-pdf is an official renderer module for the json-render framework created by Vercel Labs. It turns declarative JSON specs into styled, paginated PDF documents using @react-pdf/renderer under the hood. This allows developers to use the same structured UI schema format to generate web interfaces, mobile screens, and printable documents like resumes and invoices.

Website: https://json-render.dev/docs/api/react-pdf

## What it is for

- Generate printable PDF invoices, resumes, or reports from structured AI JSON outputs
- Share a single document schema between interactive web UI and downloadable PDF exports
- Stream generated PDF documents directly to server responses using Node.js buffers or streams
- Build customizable document templates with custom React PDF components and dynamic state binding

## Features

- Translates json-render specifications directly into React PDF component trees
- Server-side export helpers including renderToBuffer, renderToStream, and renderToFile
- Prebuilt standard document components: Document, Page, View, Row, Column, Heading, Text, Table, List, and PageNumber
- Server-safe sub-path imports (@json-render/react-pdf/server) to avoid bundling heavy React dependencies
- Dynamic property resolution and state management with external store support
- Custom component registry definition via defineRegistry and defineCatalog

## Pricing

Open source. Free and open source (part of json-render OSS)

## Details

- Type: GitHub repo
- Category: [Development](https://xiry.app/topics/development.md)
- Open source: yes
- Platforms: Code library, Web
- For: TypeScript and React developers building generative UI apps or automated PDF pipelines.
- Alternative to: @react-pdf/renderer, Puppeteer, jsPDF
- Tags: pdf, react pdf, json render, generative ui, typescript, vercel

## Why it was saved

- [@ctatedev, 20 February 2026](https://x.com/ctatedev/status/2024761826479620208): Enables generating real, structured PDF documents (invoices, reports, resumes, letters) from the same generative-UI JSON schema, so one JSON format outputs UI and print documents.

## Compare

- [Alternatives to Puppeteer](https://xiry.app/alternatives/puppeteer.md)

## Related

- [assistant-ui](https://xiry.app/resources/assistant-ui): Open-source TypeScript and React component library for building AI chat interfaces (Web app, Open source)
- [Chat SDK](https://xiry.app/resources/chat-sdk): Universal TypeScript layer for building bots and agents across chat platforms (GitHub repo, Open source)
- [Chat SDK 101](https://xiry.app/resources/chat-sdk-101): Unified TypeScript SDK overview for multi-platform chat bot development (Tip, Open source)
- [Domain SDK](https://xiry.app/resources/domain-sdk): TypeScript SDK for adding and managing custom customer domains across platforms (GitHub repo, Open source)
- [JSON Render PDF Pattern](https://xiry.app/resources/json-render-pdf-pattern): AI pattern for generating PDFs from prompts with streaming JSON previews (Web app, Free)
- [Midday React PDF Invoice Template](https://xiry.app/resources/midday-react-pdf-invoice-template): Open-source React PDF template and Next.js route for rendering invoices (Website, Open source)

Updated 10 October 2026. Page: https://xiry.app/resources/json-render-react-pdf

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.
