PDFをSVGに書き出し
ベクター線・グリフ・画像をページごとのSVGに書き出し
ファイルはこのブラウザ内でのみ処理されます。サーバーにはアップロードされません。
ページのベクター線・フォントのグリフパス・埋め込み画像をページごとのSVGに書き出し
パスワード付きのPDFです。
別のツールで続ける
処理しています…
すべての処理はこのブラウザ内で行われます。ファイルがサーバーに送信されることはありません。
ダウンロードするファイルの準備ができました
この結果で編集を続ける
ページプレビューを開く
設定を変えると前の結果は隠れます。もう一度作成して最新の設定で保存してください。
暗号化されたPDFは先にパスワードを解除してください。ページの内容を中心に処理するため、しおり・添付・フォーム・署名の保持は保証されません。原本を保管し、結果をご確認ください。
処理中…
0.0
停止していません。計算が終わると結果が表示されます。
PDFをSVGに書き出しについて
PDFの各ページを1ページ1ファイルのSVGに書き出します。線や図形はベクターのパスに、文字はフォントの字形をなぞったパスに、写真はPNGとしてSVGの中に入れます。ロゴや図面、インフォグラフィックをWebページやFigma・Illustratorに移し、拡大しても粗くならないように使いたいときのためのツールです。
SVGの大きさは元のページサイズをptのまま使います。A4なら595.28×841.89ptのSVGになります。複数ページならページごとにファイルができ、ZIPでまとめて保存できます。
描画の手順を書き取る方式
ブラウザのPDFエンジンであるpdf.jsには以前SVG出力機能がありましたが、現在は削除されています。そこでこのツールは、pdf.jsがページをキャンバスに描くときに出す「このパスをこの色で塗る」「この画像をここに置く」といった命令を途中で横取りして記録し、それをSVGの要素に書き換えます。
文字はフォントファイルを使わず字形の輪郭で描かせて書き取ります。元のフォントがないパソコンでも同じ形に見えますが、SVGの文字は図形なので選択・検索・打ち直しはできません。
そのままは移らないもの
- グラデーションやパターンの塗り：ベクターでは移せないため、その図形の範囲だけを画像(PNG、1ptあたり2ピクセル)に焼き込んで同じ位置に入れます。見た目の色は合いますが、大きく拡大するとぼやけ、編集ソフトで色を変えることはできません。
- クリッピング：クリッピングパスはSVGのclipPathとして移すので、丸や四角の枠で切り抜いた写真も切り抜かれたまま出ます。ただし縁をぼかすソフトマスクや透明グループは、合成し終えた画像で入ります。
- 描画モード（乗算・スクリーンなど）：無視され、通常の重なりで描かれます。不透明度は保たれます。
- 容量：写真をPNGで保存し直すため、元のPDF内のJPEGより大きくなることがよくあります。
例
会社案内の表紙からロゴを取り出す
- 入力
単色ベクターのロゴ、背景写真、グラデーションの帯がある表紙1ページ- 結果
SVG 1つ：ロゴとタイトル文字は編集できるパス、写真とグラデーションの帯は埋め込みPNG
Figmaに読み込み、ロゴのパスだけを選んでコピーすれば使えます。グラデーションの帯は同じ形の画像で入るので、色を変えたいときは編集ソフトでその位置にグラデーションを描き直します。拡大すれば、ロゴがもともとベクターだったのか画像だったのかもすぐ分かります。
使い方
- PDFを開きます。
- 変換が終わったらスライダーでページを送りながらプレビューを確認します。
- 必要なページのSVGを保存するか、全ページをZIPで保存します。
よくある質問
SVGの文字は直せますか？
直せません。文字は輪郭の図形です。文言を変えるなら編集ソフトでその図形を消して打ち直します。文字をテキストとして取り出したいならPDFテキスト抽出ツールを使ってください。
スキャンPDFもベクターになりますか？
なりません。スキャンしたページは1枚の画像なので、SVGにも画像1つとして入ります。画像を線に変換するトレースは行いません。
Webで使うときの注意は？
文字の多いページは1文字ごとにパスができるのでファイルが大きくなります。ロゴや図形が中心のページに向いています。
出典
基準日: