HTMLをPDFに変換
HTMLコードを貼り付けるか、保存したWebページを画像やスタイルシートごと開くと、実際の用紙幅でプレビューできます。用紙サイズ、余白、ヘッダー、フッター、ページ番号を選んでPDFをダウンロード。ブラウザの印刷機能を使えば、文字を選択・検索できるPDFも作れます。ファイルはどこにもアップロードされません。
無料・登録不要
使い方
- HTMLを貼り付けるか、.htmlファイルを画像やCSSファイルといっしょに開きます。
- プレビューを確認し、用紙サイズ、向き、余白を選びます。
- 必要に応じてヘッダー、フッター、ページ番号を追加します。
- 「PDFをダウンロード」か、文字を残したい場合は「文字を選択できるPDFとして保存」をクリックします。
このツールの特長
コードでもファイルでも
.htmlファイルを画像・フォント・CSSといっしょに開けば、自動で関連付けます。
用紙幅でプレビュー
印刷範囲の幅でプレビューするので、改行位置を変換前に確認できます。
ページ設定
A4、B5(JIS)、A3、A5、レターなど。縦・横、余白も自由に設定できます。
きれいな改ページ
行と行の間で改ページし、break-before: page などのCSS指定にも従います。
ヘッダー・フッター・ページ番号
各ページの上下に文字を入れ、「2 / 5」のようなページ番号を付けられます。日本語もそのまま表示されます。
アップロードなし
変換はブラウザ内で完結。請求書や契約書などの機密文書も安心です。
HTMLをPDFにする2つの方法
「PDFをダウンロード」は、プレビューどおりに各ページを描画して高解像度の画像として保存します。どのPDFビューアーでも見た目が同じで、Webフォント、グラデーション、SVGのグラフもそのまま残ります。そのかわり、文字の選択や検索はできません。
「文字を選択できるPDFとして保存」は、指定した用紙サイズ・余白・ページ番号でブラウザの印刷機能にページを渡します。プリンターで「PDFに保存」または「Microsoft Print to PDF」を選んでください。文字とリンクが残り、ファイルサイズも小さくなるので、請求書や契約書に向いています。
| PDFをダウンロード | PDFとして保存(印刷) | |
|---|---|---|
| 文字の選択・検索 | できない | できる |
| リンク | 使えない | 使える |
| プレビューとの一致 | 完全に一致 | ほぼ一致 |
| ファイルサイズ | 大きめ | 小さめ |
| スマートフォン | 使える | ブラウザによる |
日本語のHTMLをPDFにするときのポイント
PDFで日本語が文字化けしたり「□」になったりするのは、フォントが見つからないことが主な原因です。このツールは端末に入っている日本語フォント(游ゴシック、ヒラギノ、Noto Sans JPなど)で描画するため、そのままでも崩れにくくなっています。特定の書体を使いたい場合は、Webフォントをリンクするか、フォントファイルをHTMLといっしょに開いてください。
縦書きの文書は writing-mode: vertical-rl を指定すれば、「文字を選択できるPDFとして保存」で縦書きのまま出力できます。学校のプリントや書類にはB5(JIS)も選べます。
CSSで改ページを指定する
要素に break-before: page を指定すると、その要素から新しいページになります。別紙や章の区切りに便利です。表の行や図を途中で分けたくないときは break-inside: avoid を指定します。どちらの変換方法でも有効です。
印刷用のスタイルは @media print にまとめ、メニューやボタンは display: none で非表示に、文字サイズは pt で指定すると紙面での大きさが安定します。
Webページを丸ごとPDFにするには
ブラウザの仕組み上、ほかのサイトのURLを直接読み込むことはできません。ページを開いて Ctrl+S(Macは Cmd+S)で「ウェブページ、完全」として保存し、保存した.htmlファイルとフォルダ内のファイルをこのツールで開いてください。画像とCSSが自動で関連付けられます。
よくある質問
HTMLはサーバーにアップロードされますか?
いいえ。プレビュー、ページの描画、PDFの作成はすべてブラウザ内で行います。社外秘の文書にも使えます。
ダウンロードしたPDFの文字を選択できないのはなぜですか?
「PDFをダウンロード」は各ページを画像として保存するためです。文字を残したい場合は「文字を選択できるPDFとして保存」を使い、印刷ダイアログで「PDFに保存」を選んでください。
URLを入力してPDFにできますか?
ブラウザの制限で直接はできません。ページを Ctrl+S で「ウェブページ、完全」として保存し、そのファイルとフォルダの中身を開いてください。
日本語が文字化けしませんか?
端末の日本語フォントで描画するため、通常は文字化けしません。特殊なフォントを使う場合は、フォントファイルもいっしょに開いてください。
ページ番号を付けるには?
「ページ番号」にチェックを入れます。ダウンロードでは右下に、印刷での保存では対応ブラウザ(最新のChromeやEdgeなど)で余白部分に表示されます。
CSS GridやFlexbox、Webフォントは使えますか?
使えます。どちらの方法も最新のレイアウトに対応しています。Webフォントはページ内でリンクされているか、ファイルとして開いていれば読み込まれます。
関連ツール
作りたいものがありますか?
作りたい内容を教えてください。
シンプルなWebサイトから本格的なアプリ、AIソリューション、自動化、カスタムシステムまで、作りたいものをお聞かせください。