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.