react-pdf

Generate PDF documents from React components using @react-pdf/renderer.

168|9|Updated Feb 11, 2026
One-click install
npx skills add https://github.com/molefrog/skills --skill react-pdf-molefrog
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: react-pdf
Source: https://github.com/molefrog/skills/tree/main/skills/react-pdf
Command: npx skills add https://github.com/molefrog/skills --skill react-pdf-molefrog

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and assets (resource) components.

What problem does it solve?

Easily generate high-quality PDF documents from React components, enabling dynamic document creation without manual formatting.

Core Features & Use Cases

  • Component-based PDF rendering with @react-pdf/renderer
  • Supports Document, Page, View, Text, Image, Link, Svg, and StyleSheet for flexible layouts
  • Use Case: generate invoices, reports, forms, or dashboards as downloadable PDFs in web apps

Quick Start

Create a simple Document component and render it to a PDF file using renderToFile.

Frequently Asked Questions about react-pdf

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate PDF documents from React components?▼

To generate PDF documents from React components, you can use the @react-pdf/renderer toolkit to render Document, Page, View, and Text elements into a high-quality downloadable file without manual formatting.

What is the best way to automate invoice and report creation in a React web app?▼

Automating invoice and report creation in a React web app is best handled by rendering JSX or TSX components into PDFs, allowing dynamic document generation with fixed headers, footers, and StyleSheet layouts.

Can I use TypeScript with the react-pdf renderer for document generation?▼

Yes, TypeScript is fully supported for PDF document generation, allowing you to author strongly typed TSX components that render into structured PDF files using the @react-pdf/renderer toolkit.

Do I need to install local fonts to render PDFs with React components?▼

Yes, you need to provide local fonts when rendering PDFs with React components, as the document generation process requires locally registered font assets to correctly typeset Text elements.

Does react-pdf support adding SVG and Image elements to generated PDF files?▼

Yes, generated PDF files support embedding SVG and Image elements, alongside Text, Link, and View components, providing flexible layout options for building complex dashboards and forms.