SVGからPNG変換ツール

SVGグラフィックをPNG画像に変換します。SVGマークアップの貼り付けまたはファイルのアップロードに対応し、出力サイズを設定してダウンロードできます。

SVG ファイルをここにドロップ、またはクリックして選択

または SVG コードを貼り付け

出力する幅（px）

出力する高さ（px）

背景

機能

SVG を貼り付けるかファイルをアップロード

出力倍率を調整（1x〜3x+）

背景を透明または白に

PNG でダウンロード

使い方

1. 入力欄にSVGコードを貼り付けるか、.svgファイルをドロップします。

2. 出力の幅・倍率を選択します。

3. 透明または白い背景を選びます。

4. 「PNGをダウンロード」をクリックします。

このツールについて

SVG は画質を落とさずに拡大縮小できるのでロゴやアイコンに最適ですが、SNS、文書作成ソフト、アプリストア、メールクライアントなど、ラスター画像しか受け付けない場所はたくさんあります。この変換ツールは SVG のコードやアップロードした .svg ファイルをブラウザー内で描画し、指定した幅と高さの PNG として書き出します。背景は透明、白、黒から選べます。ベクターを目的のサイズで直接描くので、SVG から作った 2048 ピクセルの PNG は小さなビットマップを拡大したものと違ってくっきりしています。引き伸ばしを避けるため出力の比率は SVG の viewBox に合わせ、画像として読み込まれた SVG は外部のフォントや画像を読み込めないので、それらは埋め込んでおいてください。

よくある質問

くっきりした高解像度の PNG を作るには？

出力の幅と高さを必要なサイズ（アプリアイコンなら 1024 × 1024 など）に設定します。SVG がそのサイズで描画されるので、小さな画像を拡大したものではなく、くっきりした PNG になります。

PNG が引き伸ばされて見えるのはなぜですか？

出力は入力した幅と高さにそのまま描かれます。それが SVG の縦横比（viewBox）と違うと、図形が押しつぶされます。変換前に viewBox の比率から高さを計算してください。

結果に文字や画像が表示されないのはなぜですか？

画像として読み込まれた SVG は、外部のフォント、スタイルシート、リンクされた画像を取得できません。デザインツールで文字をアウトライン化するかフォントを埋め込み、画像は data URL として SVG 内に埋め込んでください。

背景は透明のままにすべきですか？

さまざまな背景に置くロゴなら透明のままにします。貼り付け先が透過に対応していない場合や、透明部分をチェック柄や黒で表示する場合は、白か黒を選んでください。

SVG はサーバーにアップロードされますか？

されません。コードはブラウザー自身の SVG エンジンと canvas で描画され、PNG はローカルで作られます。そのため、非常に複雑な SVG ではラスタライズに少し時間がかかることがあります。

SVGからPNG変換ツール

機能

使い方

このツールについて

よくある質問

関連ツール