0

SVG to PNG 変換

任意のSVGファイルを、指定した解像度でくっきりとしたPNGにラスタライズします。透明または単色の背景を選択でき、1x/2x/3xの一括書き出しにもワンクリックで対応します。

🔒 ブラウザ内で完全に処理されます。ここに入力した内容はアップロードされません。

🖼️

画像をドラッグ&ドロップ

.svgファイルをここにドロップするか、クリックして参照

処理中... 0%
SVGを読み込み中
各倍率でラスタライズ中
完了

結果

Preview Output

SVGはベクター形式です。図形やパスを数式で記述するため、どれだけ拡大しても品質が劣化しません。しかしその反面、単なる画像を期待する多くの場面(メールの署名、ファビコンアップローダー、印刷用テンプレート、古いCMS、チャットアプリなど)では受け付けてもらえません。PNGに変換することで、ベクターの図版を固定のピクセルグリッドに焼き付け、あらゆるプログラム、カメラロール、アップロードフォームで開ける形式にします。このツールは、まさにそのラスタライズ処理を、お使いのデバイス上だけで完結させます。

変換は2段階で行われます。まずブラウザがSVGに宣言されたwidth、height、viewBoxを読み取り、本来の縦横比を割り出します。次に、そのベクター図版を、お客様が指定した解像度のHTML Canvas上に描画します。描画の最終段階までソースはベクターのままなので、ロゴを64pxでレンダリングしても6400pxでレンダリングしても、輪郭はくっきりとシャープなままです。既存のJPGやPNGを拡大する場合のような、拡大による中間ビットマップのぼやけは一切発生しません。

インターフェースやアプリのアイコンは、ほとんどの場合、複数のピクセル密度で必要になります。そこで本ツールは、指定された基準サイズの1x、2x、3xバージョンを一度の処理でレンダリングし、それぞれにダウンロードボタンを用意します。これは、iOSのアセットカタログ、Androidのドローアブル、レスポンシブWeb画像(srcset)で採用されているのと同じ3段階の方式です。基準となる幅を一度決めるだけで、数値を変えながら3回も変換を実行する手間なく、3つのファイルを一度に取得できます。

背景の扱いは、装飾的なチェックボックスではなく、実用的な選択肢です。他のコンテンツの上に重ねるロゴやアイコン用に、アルファチャンネルを維持した透明背景のままにするか、サムネイル、ソーシャルプレビュー画像、透明度を適切に処理できない古い形式など、出力先が不透明な背景を必要とする場合に、任意の単色で塗りつぶすかを選べます。どの段階においても、サーバーにデータがアップロードされることはありません。SVGテキストの解析、ラスタライズ、PNGへのエンコードは、すべてお使いのブラウザのタブ内で完結します。