ToolConvoyToolConvoyv2.6
IMAGE

SVG を PNG に変換 — SVG ベクターグラフィックを PNG ラスター画像に変換

SVG ベクターグラフィックを PNG ラスター画像に変換します。幅・高さ・DPI をカスタマイズ可能 — ブラウザ上で動作、アップロード不要。

● ローカル動作 · EXIF はアップロードされませんページ読み込み以降のツールによる通信：0件

SVG 画像をここにドロップ

またはクリックして参照（最大 50MB）

こんなツールも

行をソートMD5 ハッシュUUID ジェネレーターJSON → CSVBase64 エンコードPDF 分割HAR → cURLTOML ツール.env ヘルパーMsgPack インスペクターPDF 圧縮PDF → EPUB
コンバーターを開く

SVG は作成・編集に最適なフォーマットです — 解像度に依存せず、テキストで編集でき、あらゆるデザインツールがネイティブに扱います。PNG は配布に最適なフォーマットです — 普遍的にサポートされ、ピクセルパーフェクトで、画像を表示するすべてのプラットフォームで受け入れられます。SVG から PNG への変換は、「まだ繰り返し改进中のデザイン」と「公開可能なアセット」の間にある標準的なワークフローのステップです。この変換は意味的に一方向で、ベクターソースが正本となり、PNG はレンダリングされたスナップショットにすぎません。将来の編集に備えて、ソースの SVG は PNG と一緒に保管しておくべきです。

変換の品質は 2 つのレンダリング判断に依存します。解像度(ピクセル単位の出力サイズ)とアンチエイリアシング(エッジの滑らかさ)です。コンバーターはブラウザの SVG エンジンを使い、指定したピクセルサイズで SVG をレンダリングするため、SVG を直接開いたときと同じ出力が得られます。DPI 設定は論理インチをピクセルにマックするので、2 インチ幅の SVG を 300 DPI でエクスポートすると 600 ピクセル幅の PNG が出力され、印刷に適します。背景はデフォルトで透明です — SVG に背景矩形がない場合、PNG の alpha チャンネルは透明になり、これはさまざまな背景の上に配置されるロゴ、アイコン、グラフィックにとって正しい挙動です。このツールはブラウザ内で完全に動作し、SVG はローカルでレンダリングされ、一切送信されません。

広告

使い方

  1. SVG ファイルをドロップ

    .svg ファイルをドロップするか、SVG マークアップを貼り付けます。レンダラーが現在の出力サイズで SVG をリアルタイムプレビュー表示するので、ラスタライズ前にグラフィックの見た目が正しいか確認できます。

  2. 出力サイズを設定

    出力の幅と高さをピクセル単位で指定します。デフォルトは SVG 自身の viewBox サイズです。「アスペクト比をロック」を有効にすると、アスペクト比を維持してリサイズできます。DPI はピクセル密度を制御します — 画面表示は 72、印刷は 300 が目安です。

  3. PNG をダウンロード

    ダウンロードをクリックして PNG を保存します。SVG に背景矩形がない場合、出力には透明背景が含まれ、PNG の alpha チャンネルが保持されます。

よくある質問

なぜ SVG を PNG にラスタライズするのですか?

PNG はあらゆる環境でサポートされています — すべての OS、すべてのメッセージアプリ、すべてのソーシャルメディアプラットフォームが PNG をネイティブにレンダリングします。SVG のサポート状況はまちまちで、特にメールクライアント、CMS へのアップロード、サードパーティの埋め込みではセキュリティ上の理由で SVG がブロックされることがあります。

PNG は透明度を保持しますか?

はい。SVG に背景の塗りつぶしがない場合、出力される PNG は透明な alpha チャンネルを持ちます。透明度は完全な 8 ビット alpha — 二値(オン/オフ)ではない — なので、アンチエイリアスされたエッジや半透明の要素はあらゆる背景に対して正しくレンダリングされます。

印刷にはどの解像度を選べばよいですか?

300 DPI で印刷する場合、希望する印刷サイズ(インチ)× 300 で計算します。4×3 インチのグラフィックを 300 DPI で印刷するには 1200×900 ピクセルが必要です。出力オプションの DPI 設定は、物理サイズからピクセルサイズを算出します。

外部スタイルシートの CSS はレンダリングされますか?

SVG 内のインラインスタイルと `<style>` ブロックはレンダリングされます。URL で参照される外部スタイルシートは取得されません。外部ホストの CSS に依存する SVG は、変換前にそのスタイルをインライン化してください。

制限事項

  • マルチ解像度エクスポートには非対応このツールは指定したサイズで 1 枚の PNG をエクスポートします。srcset 用のレスポンシブ画像(1x、2x、3x)が必要な場合は、解像度ごとに変換を複数回実行してください — 出力サイズはエクスポートごとに設定可能です。
  • アニメーションは失われるSVG のアニメーション要素は初期状態のみレンダリングされます。アニメーションする SVG をエクスポートするには、ブラウザのレンダリングを動画として録画するか、別のツールで個別フレームを PNG としてエクスポートしてください。
  • フォントのレンダリングはシステムフォントに依存SVG 内のテキストは、ブラウザで利用可能なフォントを使ってレンダリングされます。SVG がインストールされていないフォントを参照している場合、ブラウザのフォールバックフォントが使用され、表示されるテキストが制作者の意図と異なる場合があります。

プラットフォーム別の注意点

macOS
macOS の同等な手段としては `qlmanage -t -s 1200 -o . file.svg`(PNG サムネイルを生成)、または画像変換に `sips` があります。ブラウザツールの利点はピクセル単位で正確にサイズを制御できることです。
Linux
Inkscape と rsvg-convert が標準的な CLI ツールです。ブラウザツールはパッケージのインストールが不要で、保存前に出力サイズをリアルタイムプレビューできます。
Web
Canvas API を使い、完全にブラウザ内で動作します。SVG はローカルでレンダリングされ、一切アップロードされません — 社外秘のロゴ、社内の図、未公開のデザインに安心して使えます。
広告
広告