shadcn-labs/pdfcn

これは何？

主な機能

• 01レンダラーにTakumiまたはFormeを使い、ReactコンポーネントからPDFを生成
• 02shadcn互換のCLIを使って、コンポーネントのソースコードをプロジェクトにコピー
• 03テーブル、フォーム、チャートなどのコンポーネントを収録
• 04請求書やレポートなどのドキュメント向けに、すぐに使えるブロックを提供
• 05ドキュメント内で、すべてのコンポーネントとブロックをライブプレビュー

ユースケース

• すでにshadcn/uiを使っているReactまたはNext.jsアプリに、請求書や領収書の生成機能を追加する
• テーブルやチャートを使った業務レポートを、ダウンロード可能なPDFとして作成する
• コードを自分で所有し、直接編集できるカスタマイズ可能なPDFテンプレートを作成する

クイックスタート

1. 1

   README にリンクされているインストールガイドを開きます

2. 2

   コンポーネントやブロックを確認し、必要なコードを React プロジェクトにコピーします

収録されている特集

トピック

よくある質問

pdfcn とは？

TakumiとFormeを基盤に、shadcn/uiとの連携を想定して作られた、PDF生成用のコピペ可能なReactコンポーネント集。 pdfcnは、React向けのすぐに使えるカスタマイズ可能なPDFコンポーネント集です。パッケージをインストールしてレンダラーを設定する代わりに、shadcn/uiのコンポーネントと同じ方式で、コンポーネントのソースコードをプロジェクトにコピーして使います。TakumiとFormeという2つのレンダリング基盤を採用しており、用途に特化したReactの構成要素からドキュメントを生成できます。

pdfcn は無料で使えますか？ライセンスは？

pdfcn は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

pdfcn は今もメンテナンスされていますか？

活発にメンテナンス中。pdfcn の最終コミットは 2026年10月15日 です。

pdfcn は何に使えますか？

すでにshadcn/uiを使っているReactまたはNext.jsアプリに、請求書や領収書の生成機能を追加する テーブルやチャートを使った業務レポートを、ダウンロード可能なPDFとして作成する コードを自分で所有し、直接編集できるカスタマイズ可能なPDFテンプレートを作成する

pdfcn のインストール方法は？

README にリンクされているインストールガイドを開きます コンポーネントやブロックを確認し、必要なコードを React プロジェクトにコピーします

pdfcn はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/shadcn-labs/pdfcn