SVG PNG変換：サイズを指定して高画質に

SVGをPNGに変換する手順

1. .svgファイルを選ぶか、ドラッグ＆ドロップします。複数まとめても構いません。
2. サイズを選びます。SVGに書かれたサイズの1倍・2倍・4倍か、横幅をピクセルで指定します。
3. 背景を選びます。透過（初期値）か単色です。
4. 「PNGに変換」を押して画像をダウンロードします。各行に仕上がりのピクセル数が表示されます。

高画質にするには、変換前にサイズを決める

SVGは線や曲線、塗り、文字を描くための「命令」の集まりなので、どんなサイズでもくっきりしています。一方、PNGは決まった数の画素の並びで、あとから引き伸ばすとぼやけます。そこでこのツールは、小さなPNGを作って拡大するのではなく、指定したサイズで直接SVGを描きます。当サイトのロゴ（259バイトのSVG）は、1倍の64 × 64 pxで1.7 KB、4倍の256 × 256 pxで8.3 KBのPNGになり、どちらもくっきりしていました。

• 画面用：スマホやノートパソコンは1つのCSSピクセルを2〜3個の物理ピクセルで表示するので、たいていは2倍が適しています。ピクセル数が指定されているときだけ1倍を使いましょう。
• SNSやスライド：横幅を指定します。Instagramの正方形の投稿なら1,080 px、フルHDのスライド全面なら1,920 pxです。
• 印刷：印刷する幅（mm）を25.4で割り、300を掛けます。SVG自体にはdpiがなく、どれだけ大きくきれいに印刷できるかはピクセル数で決まります。

SVG本来のサイズの決まり方

1倍のサイズは、SVGに書かれたwidthとheightから決まります。単位はブラウザーと同じく1インチ＝96ピクセルで換算するので、width="2in"は192 px、72ptは96 px、10mmは約38 pxです。Figma、Inkscape、アイコン素材から書き出したSVGには、widthとheightがなく0 0 24 24のようなviewBoxだけのものが多くあります。その場合はこの数字を使うので、1倍で24 × 24になります。片方だけ書かれているときは、もう一方をviewBoxの縦横比から求めます。どちらもないSVGはブラウザーの初期値の300 × 150 pxになるので、横幅を指定してください。

描画されないもの

画像として変換するSVGを、ブラウザーは制限付きのモードで描画します。悪意のあるファイルから守るための仕組みですが、次の制限があります。

• 外部のファイルは無視されます。SVGがWebアドレスから読み込む画像やフォント、スタイルシートは表示されません。ファイルに埋め込まれたもの（data URI）は表示されます。
• Webフォント：端末に入っていないフォントの文字は、標準のフォントに置き換わります。書き出す前に文字をアウトライン化してください。Inkscapeは「パス › オブジェクトをパスへ」、Illustratorは「書式 › アウトラインを作成」、FigmaはSVG書き出し設定の「Outline text」です。
• スクリプトは実行されず、アニメーションするSVGは1枚の静止画になります。

透過か、単色の背景か

PNGは透過を保てるので、背景が透明なロゴはどんなスライドや写真にもきれいに重ねられます。透明な部分が黒や市松模様で表示されてしまう一部のチャットアプリなどには、単色の背景を選んでください。JPGが必要なら、できたPNGをPNG JPG変換で変換できます。処理はすべてブラウザーの中で行われ、ファイルはアップロードされません。

よくある質問

最終更新日：2026年10月15日