# SVGをPNGに変換 > SVG PNG 変換は、SVGのコードまたはSVGファイルを、指定した幅とピクセル密度でPNG画像に変換する無料のオンラインツールで、描画にはChromiumを使います。 SVGをPNGに変換する無料のオンラインツールです。SVGのコードまたはSVGファイルを、指定した幅とピクセル密度で変換できます。レンダリングサーバー上のヘッドレスChromium（画面を持たないブラウザエンジン）で描画するため、ブラウザが同じSVGを描いた内容でPNGを作れます。 ## 主な仕様 - 入力：SVGのコードまたは2 MBまでの.svgファイル。スクリプトとイベント属性は、先にブラウザ内で取り除かれます。 - 出力：PNG。幅は100から4000pxまで、1x、2x、3xから選べ、背景は透過、白、または色を選べます。 - 無料ツールの高さの上限は2000pxです。SVGが埋め込んでいないテキストは、レンダリングサーバーのフォントで描かれます。 - アカウント登録なしの無料利用では、訪問者ごとに毎分10件、毎日50件まで変換でき、透かしは入りません。ログインしているユーザーは、レンダリングごとに1クレジットを使用します。毎月100無料クレジットが付与されます。 - ファイルは自動的に削除されます。アカウント登録なしの場合は変換後10分、無料アカウントの場合は1日で削除されます。 - 開発者は、APIキーを付けてPOST https://api.aiipworld.com/v1/renderを送信すると、同じレンダリングを実行できます。詳しくはスクリーンショットAPIページをご覧ください。 ## 使い方 1. SVGのコードを入力欄に貼り付けるか、「ファイルを選択」からデバイスの.svgファイルを選びます。 2. ツールがSVGの幅と高さ、またはviewBoxから読み取ったサイズを確認します。 3. 出力する幅をピクセルで入力します。空欄のままにすると、SVGの幅がそのまま使われます。 4. ピクセル密度を1x、2x、3xから選び、背景を透過、白、または色から選びます。 5. 「PNGに変換」をクリックし、出力サイズを確認してからPNGをダウンロードします。 ## SVG PNG 変換の手順 SVGのコードを入力欄に貼り付けるか、.svgファイルをデバイスから開いて変換します。変換前に、SVGはブラウザ内でDOMPurifyにより整理され、スクリプトとイベント属性は取り除かれます。 ツールはSVGの幅と高さ、またはviewBoxからサイズを読み取り、画面に表示します。変換が終わると、出力サイズがピクセル単位で表示されます。 出力されるPNGファイルは、そのままダウンロードできます。アカウント登録なしで使う場合は、変換の前にセキュリティ確認が必要です。ログインしているユーザーはセキュリティ確認が不要で、クレジットを使って変換します。 ## 出力サイズとピクセル密度 出力する幅はピクセルで指定します。空欄のままにすると、SVGの幅が使われます。高さはSVGの縦横比に合わせて自動で決まるため、計算は不要です。 ピクセル密度は、出力サイズの1単位にいくつのピクセルを描くかを決めます。1x、2x、3xから選べます。2xや3xでは、同じ出力サイズでもピクセル数が増えます。 無料ツールでは、出力の高さは2000pxまでです。縦に長いSVGで高さが上限を超える場合は、幅を小さくするか、SVGを編集して短くしてください。 - 幅が空欄：SVGの幅を使います。 - ピクセル密度：1x、2x、3xから選びます。 - 高さ：SVGに合わせて決まります。無料ツールでは2000pxまでです。 ## 透過背景の扱い 背景は初期設定で透過です。塗りのない部分は、PNGでも透過のままになります。塗りが指定されている部分は、その色が残ります。 白や色を選ぶと、画像の後ろに単色の背景がつきます。ロゴやアイコンは、他のデザインに置いて使うために透過のままにするのがおすすめです。 ## フォントと画像の扱い テキストは、レンダリングサーバーにインストールされたフォントで描かれます。対象は、Liberation Sans、Liberation Serif、Liberation Mono、Noto Sans、Noto Serif、Noto Sans Displayです。Noto系のフォントは、Arabic、Hebrew、Devanagari、Thai、CJK文字など多くの文字体系も扱えます。 Arial、HelveticaはLiberation Sansに、Times New RomanはLiberation Serifに、Courier NewはLiberation Monoに、GeorgiaはNoto Serifに対応づけられます。Segoe UI、Roboto、Interなどサーバーにないフォントは、代替フォントで描かれます。 デバイスにあるフォントは、サーバーにはありません。特定のフォントを保つには、SVGにフォントを埋め込むか、公開URLまたはデータURLから@font-faceで読み込みます。 外部の画像は、公開されたhttpまたはhttpsのアドレスからのみ読み込まれます。プライベートネットワークやlocalhostを指す画像は読み込まれません。 ## SVGとPNGの違い PNGのピクセル数は、選んだ幅とピクセル密度で決まり、あとから変えることはできません。別のサイズが必要になるかもしれない場合は、元のSVGを残しておき、必要なサイズで変換し直してください。 このツールが出力するのはPNGのみです。ベクターのままPDFにしたい場合はSVG PDF 変換ツールを使ってください。図形とテキストをベクターのまま保ち、PDFの用紙サイズはSVGのサイズと同じになります。HTMLからJPGやPNGの画像を作りたい場合は、貼り付けたHTMLをPNGまたはJPGで出力できる「HTMLを画像に変換するツール」を使ってください。 ## SVGから削除される内容 変換の前に、ツールはSVGをDOMPurifyで整理します。スクリプト、イベント属性などの部分は取り除かれ、それ以外の描画内容は残ります。 JavaScriptで内容を描くSVGは、PNGにその内容が表示されません。PNGはChromiumで描画されるため、結果はブラウザが描く内容になります。 ダウンロードする前に、出力サイズと画像の見た目を確認してください。 ## APIでSVGをPNGに変換 同じ変換は、レンダリングAPIからも実行できます。SVGをhtmlフィールドに入れ、outputをpngに設定して、POST /v1/renderに送信します。認証には、Authorization: Bearerに続けてAPIキーを入れるか、x-api-keyヘッダーを使います。 リクエストに成功すると、202とjob_idが返ります。GET /v1/jobs/:idを呼び出し、statusがsucceeded、failed、またはtimeoutになるまで確認します。成功したら、download_urlからダウンロードしてください。download_urlは短時間で無効になるため、ジョブが終わったら早めにダウンロードしてください。 失敗したジョブとタイムアウトしたジョブのクレジットは返却されます。各ジョブは新しいブラウザのコンテキストで実行されるため、Cookieやキャッシュは引き継がれません。一括処理のエンドポイントはないので、文書ごとに1回ずつリクエストを送ります。Webhookはまだ利用できません。 ## このツールを使う場面 SVGを受け付けないページやアプリで使うために、ベクター図をPNG画像にした版を作る場合に便利です。コードを貼り付けるかファイルを開き、幅とピクセル密度を選ぶと、ヘッドレスChromiumがPNGを描きます。 ## ロゴやアイコンのSVGをPNGに SVGのロゴ、アイコン、図形をPNG画像にする作業に向いています。このツールは「svgtopng」という名前で探されることもあります。行う作業は同じです。 SVGを画像に変換したい場合も、ここで作れる画像の形式はPNGです。無料で使え、アカウント登録は不要で、透かしも入りません。インストールも不要です。ベクターのままPDFにしたい場合は、SVG PDF 変換ツールを使ってください。 ## 高解像度のPNGを作る方法 高解像度で出力するには、幅を大きくし、ピクセル密度を2xまたは3xに設定します。幅は4000pxまで指定できます。無料ツールでは、出力の高さは2000pxまでです。縦に長い図は、幅を小さくしてください。 ツールは図の縦横比を保つため、幅だけを指定すれば十分です。元のSVGを残しておけば、あとから別のサイズで変換し直せます。 ## よくある質問 ### SVGファイルをPNGに変換できますか？ はい、変換できます。SVGのコードを貼り付けるか、.svgファイルを開き、設定を選んで変換してください。結果はダウンロードできるPNGです。アカウント登録なしで使う場合は、先にセキュリティ確認が必要です。 ### SVGとPNGの違いは何ですか？ PNGは、選んだ幅とピクセル密度で決まる固定のピクセル数を持つ画像です。別のサイズが必要になるかもしれない場合は、元のSVGを残しておいてください。必要なサイズでもう一度変換できます。 ### 背景を透過のままにするには？ 背景の初期設定は透過なので、そのまま変換してください。塗りのない部分は透過のままになります。白や色を選ぶのは、単色の背景が必要な場合だけです。 ### PNGのサイズはどのくらいになりますか？ 幅は指定した出力幅のピクセル数になります。高さはSVGの縦横比に合わせて決まります。2xや3xのピクセル密度では、同じ見た目の大きさでもピクセル数が増えます。 ### テキストの見た目が違うのはなぜですか？ テキストは、レンダリングサーバーにインストールされたフォントで描かれるためです。Segoe UI、Roboto、Interなどサーバーにないフォントは代替フォントで描かれます。正確に合わせるには、SVGにフォントを埋め込んでください。 ### SVGのスクリプトは実行されますか？ いいえ、実行されません。変換の前に、スクリプトとイベント属性は取り除かれます。残った描画内容が、ブラウザが描く通りにPNGになります。 ### SVGをJPGに変換できますか？ このツールが出力するのはPNGのみです。JPGが必要な場合は、貼り付けたHTMLをPNGとJPGで出力できる「HTMLを画像に変換するツール」を使ってください。 ### 変換できるサイズの上限はどのくらいですか？ 無料ツールでは、出力の幅は100から4000pxまでです。高さは100から2000pxまでです。2 MBを超えるSVGファイルは開けません。 ### 変換したPNGはどのくらい保存されますか？ 無料ツールの結果は、10分後に削除されます。履歴は残らないため、削除される前にダウンロードしてください。 ### アカウントは必要ですか？ 必要ありません。セキュリティ確認を済ませれば、アカウントなしで変換できます。ログインしているユーザーはセキュリティ確認が不要で、クレジットを使って変換します。出力に透かしは入りません。 ### PNGはブラウザで見た表示と同じになりますか？ 基本的には同じです。同じSVGをChromiumで描画するため、ブラウザが描く内容と一致します。変わるのは、スクリプトとイベント属性が取り除かれる点だけです。 ### SVGからPNGへの変換はコードから実行できますか？ はい、レンダリングAPIから実行できます。SVGをhtmlフィールドに入れ、outputをpngに設定したリクエストを送ってください。ジョブが成功するまで確認します。失敗したジョブのクレジットは返却されます。 ## 関連ツール - [PNGをSVGに変換](https://aiipworld.com/ja/tools/png-to-svg/index.md) - [JPGをSVGに変換](https://aiipworld.com/ja/tools/jpg-to-svg/index.md) - [画像をベクター化（SVGに変換）](https://aiipworld.com/ja/tools/vectorize-image/index.md) - [SVGをPDFに変換](https://aiipworld.com/ja/tools/svg-to-pdf/index.md) - [PNGをWebPに変換](https://aiipworld.com/ja/tools/png-to-webp/index.md) - [WebPをPNGに変換](https://aiipworld.com/ja/tools/webp-to-png/index.md) ページ： https://aiipworld.com/ja/tools/svg-to-png/