#What is pdfcn?

pdfcn is an open-source React component library designed for developers who need to generate professional PDFs without building every document layout from scratch. It combines reusable React components with Takumi and Forme rendering engines and distributes them through a shadcn-compatible registry. Developers can use it for invoices, reports, financial documents, certificates, business documents, and other application-generated PDFs while retaining full control over styling and source code.

#Features ⚡

• Dual PDF Rendering: Choose between Takumi and Forme as the underlying PDF renderer.

• Shadcn-Compatible Installation: Components can be installed using the familiar shadcn CLI and registry workflow.

• Zero Configuration: Designed to work out of the box with sensible defaults.

• Live Previews: Components and document blocks can be previewed directly within the documentation.

• Fully Customizable: Developers receive editable component code with customizable props and shared themes.

• Composable Components: Build larger documents using smaller focused React components.

• Complete PDF Blocks: Install full document templates such as invoices and business reports instead of assembling every page manually.

• Built-In Theming: pdfcn includes several ready-made visual themes that integrate with its theme provider.

• Business-Focused Elements: Includes tables, charts, forms, signatures, QR codes, headers, footers, and page numbering.

#Pro and cons

Pro ✅:

• Completely free and open source

• MIT licensed

• Familiar workflow for shadcn/ui users

• Supports both Takumi and Forme

• Large collection of PDF-specific components

• Includes complete document templates

• Multiple ready-made themes

• Full source-code customization

• Well suited for invoices and reporting interfaces

Cons ⚠️:

• Primarily targeted at React projects

• Requires Takumi or Forme as a PDF rendering engine

• More specialized than general-purpose UI component libraries

• Developers may need PDF-specific layout knowledge for advanced documents

• Browser UI components from shadcn/ui cannot automatically be treated as PDF components

#Included Components/Templates

pdfcn includes both individual PDF components and complete document blocks. The current component collection includes more than 20 reusable building blocks.

• Alert

• Badge

• Card

• Data Table

• Divider

• Form

• Graph

• Heading

• Keep Together

• Key Value

• Link

• List

• Page Break

• Page Footer

• Page Header

• Page Number

• PDF Image

• QR Code

• Section

• Signature

• Stack

• Table

• Text

• Watermark

Complete document blocks currently include:

• Invoice Classic

• Invoice Consultant

• Invoice Corporate

• Invoice Creative

• Invoice Minimal

• Invoice Modern

• Financial Report

• Marketing Report

• Operations Report

• Security Report

pdfcn also provides Professional, Modern, Minimal, Executive, Corporate, Elegant, Vivid, Forest, and Blueprint themes.

#Pricing 💸

pdfcn is completely free and open source. The project is distributed under the MIT License and does not currently advertise a paid Pro component tier.

• Free: $0

• Open-source

• MIT License

• No paid component subscription

• Source code can be customized

• Commercial projects can use it subject to the MIT License terms

#Integrations 🧰

pdfcn is designed around the modern React and shadcn ecosystem.

• React

• TypeScript

• shadcn/ui

• shadcn Registry

• Takumi

• Forme

• JSX

• Modern React frameworks

• npm

• pnpm

• Yarn

• Bun