# Introduction

Copy-paste PDF components for React. Built on Takumi and Forme, works with the shadcn CLI.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



**pdfcn** provides beautifully designed, accessible, and customizable PDF components. Built on [Takumi](https://takumi.kane.tw/docs/pdf) and [Forme](https://docs.formepdf.com), and designed to work seamlessly with the [shadcn CLI](https://ui.shadcn.com).

## Philosophy [#philosophy]

pdfcn follows the shadcn model for document generation: copy-paste components you can own, with zero lock-in and sensible defaults that work immediately.

PDF layouts are often treated as one-off templates — assembled with renderer-specific primitives, duplicated styling, and brittle page-break logic. pdfcn takes a different approach. It stays close to each renderer's primitives, keeps the API familiar across Takumi and Forme, and lets you drop down to the underlying renderer whenever you need more control.

The goal is simple: make generated PDFs feel like the rest of your stack — composable, themeable, accessible, and easy to customize.

## Why pdfcn? [#why-pdfcn]

Most PDF component setups are either too opinionated or too scattered. pdfcn is built for teams that want to ship quickly without giving up control:

* **Own Your Code:** Copy the components into your project and customize everything.
* **Start Fast:** Run one command and render your first document with production-ready defaults.
* **Choose Your Engine:** Use the same component API with Takumi or Forme, then drop to raw renderer APIs when needed.

## Features [#features]

<div className="not-prose grid gap-4 sm:grid-cols-2 mt-4">
  <FeatureCard icon="ZapIcon" title="Zero Config" description="Works out of the box with sensible defaults and renderer-aware installation." />

  <FeatureCard icon="SunMoonIcon" title="Theme Aware" description="Share a consistent PDF theme across components, blocks, and both rendering bases." />

  <FeatureCard icon="LayoutGridIcon" title="Composable" description="Build invoices, reports, forms, and tables from small declarative components." />

  <FeatureCard icon="Code2Icon" title="TypeScript" description="Full type safety with matching public props across Takumi and Forme." />

  <FeatureCard icon="ClipboardCopyIcon" title="Copy & Paste" description="Own your PDF code. Install it into your project and customize every detail." />

  <FeatureCard icon="BlocksIcon" title="shadcn Compatible" description="Uses the shadcn registry format — add components and blocks with one command." />
</div>