SVGからPNGへ
SVGグラフィックを任意のサイズのPNGに変換 — 1倍・2倍・4倍、背景は透明か白を選択。すべてブラウザ内で処理されるため、アップロードはありません。
ここに画像をドロップ、またはクリックして選択
ローカル処理 — 何もアップロードされません
SVGをPNGに変換する方法
SVGファイルをボックスにドラッグします。ベクター画像は即座に読み込まれ、元のサイズで表示されます。ファイルはこのタブに留まり、アップロードされません。
出力幅と倍率を選びます — Retina画面用には2倍・4倍で書き出します。背景は透明か白塗りを選択します。
「変換」をクリックしてPNGをダウンロードします。チャットアプリ・SNS・SVGを受け付けないOfficeソフトなど、どこでも開けます。
知っておきたいコツ
PNGとSVG:用途に合った形式の選び方
2つの形式は異なる問いに答えます。SVGは「どのサイズでもシャープを保つには?」— 設計・編集・サイト構築の段階に最適。PNGは「どこでも確実に開くには?」— 配布に最適です。数十年にわたり、あらゆるOS・チャットアプリ・ブラウザがPNGを表示してきたからです。実用的なワークフローは両方を使います:デザインツールではSVGマスターを保持し、各プラットフォームが必要とする正確なサイズのPNGコピーを書き出す。本コンバーターはその書き出し工程を担い、ベクターマスターを数秒で使えるPNGに変えます。
Retinaとレスポンシブ書き出し:なぜ2倍が重要なのか
現代のスマホやノートPCの画面は、1つのCSSピクセルに2〜3個の物理ピクセルを詰め込んでいます。100CSSピクセル幅で書き出したアイコンはRetinaディスプレイ上で200物理ピクセルに引き伸ばされます — PNGは足りないディテールを作り出せないため、ぼやけて見えます。解決策は簡単です:2倍(超高密度画面なら4倍)で書き出し、ブラウザに縮小表示させます。ここの2倍・4倍オプションはまさにそれで、元がベクターなので、拡大した書き出しはどれも完全にシャープです。2つのサイズで迷ったら大きい方を選びましょう — 鮮明なPNGの縮小は常に安全、小さいPNGの拡大は決して安全ではありません。
透過背景を正しく扱う
PNGはピクセルごとに「アルファ」という値を1つ余分に持ち、そのピクセルの透明度を表します。透明領域を持つSVGを変換するとこの情報も引き継がれ、PNGはアイコン・スタンプ・背景を選ばない切り抜き商品写真に自然な形式となります。注意点は透明の周囲です。ダークモードアプリでは完全に透明なアイコンが黒い画面に溶けて消え、プレビューツールは透明を市松模様で表示するためスクリーンショットで奇妙に見えます。白背景オプションはまさにそんなときのためにあります — 画像をフラット化してどこでも同じ見た目にする代わりに、アルファチャンネルを失います。
よくある質問
なぜSVGではなくPNGが必要なのですか?+
SVGはデザイン作業には最適ですが、日常的な多くのプラットフォームは受け付けません:Instagram投稿・WhatsAppスタンプ・Word文書・メール署名はPNGのようなラスター形式を前提にしています。どこでもそのまま使える画像が必要ならPNGに変換しましょう。
どのサイズで書き出すべきですか?+
最終用途に合わせます:アイコンを等倍で表示するなら1倍、Retina画面のWeb・アプリグラフィックは2倍、カバーやポスターなど印刷物は4倍です。SVGはベクターなので、大きく書き出してもぼやけません — コストはファイルサイズだけです。
透過背景は変換後も残りますか?+
はい — PNGはアルファチャンネルを保持するため、透明部分は透明のままです。白背景はフラット化したいときだけ選んでください。たとえばダークモードのビューアで透過アイコンが見えなくなるのを避ける場合などです。
このコンバーターは本当に無料ですか?+
はい。レンダリングは端末上で行われます — サーバーもアップロード待ちもなく、透かしも一切入りません。何枚でも変換できます。
SVGが白紙でレンダリングされるのはなぜですか?+
ほぼ間違いなく、スクリプトで描画するSVGか外部ファイルを参照するSVGです。単体のコンバーターでは読み込めません。Figma・Illustrator・Inkscapeから書き出したファイルは正常にレンダリングされます。フレームワーク製の場合は、まずデザインツールから通常の静的SVGとして書き出してから変換してください。