SVG → PNG
SVGをPNGに変換
SVGを必要なサイズのPNGに書き出します。透過もそのまま保てます。画像を描くのはお使いのブラウザなので、ファイルが端末の外に出ることはありません。
SVGファイルをここにドロップ クリックしてファイルを選ぶか、Ctrl+Vで貼り付け SVG
ブラウザ内で処理 · ファイルは端末から出ません
SVGをPNGに変換する方法
- SVGを追加します。 ファイルをドロップするか、クリックして選ぶか、Ctrl+Vで貼り付けます。
- サイズを選びます。 SVGで指定されたサイズの1倍・2倍・4倍を選ぶか、幅をピクセルで入力します。高さは縦横比に合わせて決まります。
- 背景を設定します。 PNGは透明な部分をそのまま残します。色で塗りつぶしたい場合はオプションにチェックを入れてください。
- PNGをダウンロードします。 同じパネルで形式をJPGやWebPに切り替えることもできます。
SVGをPNGに高画質で変換
SVGには決まった解像度がないので、PNGは指定しただけ大きくできます。ツールはSVGのwidthとheightから、それがない場合はviewBoxからサイズを読み取り、新しいサイズでベクターを描き直します。引き伸ばしは一切ありません。4倍のPNGは、小さなビットマップを拡大したものではなく、曲線から4倍のサイズで描いたものです。
| 用途 | おすすめのサイズ |
|---|---|
| 通常の画面で表示するWeb画像 | SVGのサイズの1倍 |
| Retinaなどの高精細ディスプレイ | 2倍 |
| スライド、資料、SNS投稿 | 2倍から4倍、またはピクセル単位の幅 |
| 印刷（300 dpi） | 幅のピクセル数 = 幅（mm）÷ 25.4 × 300 |
背景を透過したままSVGをPNG変換
PNGはアルファチャンネルに対応しているので、SVGで何もない部分はPNGでも透明なままです。プレビューでは透明な部分を市松模様で表示します。PNGを置く背景の色でイラストが見えにくくなる場合は、ダウンロード前に背景を色で塗りつぶしてください。
SVGよりPNGを使うべき場面
Webのロゴやアイコンには、どのサイズでもくっきり表示されるSVGが向いています。PNGは、SVGを受け付けない場面での確実な選択肢です。SNS、メールの署名、Officeの書類、ECモール、多くのアプリがそうです。変換すると見た目も固定されるため、フォントや効果が別のソフトで違って表示されるといった問題も避けられます。
PNGに変換するとSVGの見た目が変わる理由
ブラウザはローカルのファイルとしてSVGを描くため、そこから外部のリソースを取得できません。Webから読み込むフォントや、URLでリンクした画像は表示されないことがあります。それらをSVGの中に埋め込むか、編集ソフトで文字をアウトライン化しておけば、PNGは画面で見たとおりになります。
SVG→PNG変換のよくある質問
SVG→PNG変換は無料ですか？
はい。登録不要で、透かしもファイル数の制限もありません。
ファイルは外部に送られませんか？
送られません。変換はブラウザ内で行われ、SVGがアップロードされることはありません。
PNGは最大でどのくらいの大きさにできますか？
幅16,000ピクセルまでです。ブラウザのキャンバスが扱える上限を超える場合は、自動的に縮小されます。
ファイルではなくSVGのコードを変換できますか？
コードをSVGビューアに貼り付けてファイルとしてダウンロードし、ここにドロップしてください。