🔷 SVGビューア
SVG画像をブラウザ内で安全にプレビューし、ソースコードの確認やPNGへの変換ができます。スクリプトなどの危険な要素は自動で除去して表示します。ファイルはアップロードされず、すべてブラウザ内で処理されます。
ここにSVGファイルをドロップ
またはクリックして選択(ブラウザ内で処理・アップロードなし)
画像情報
| 幅(width) | - |
|---|---|
| 高さ(height) | - |
| viewBox | - |
背景
PNG/JPEG変換
倍率
※ 外部ファイル(画像・フォント等)を参照しているSVGは、PNG/JPEGへ変換できない場合があります。JPEGは透過部分を白で塗りつぶして保存します。
📘 使い方
- 「ここにSVGファイルをドロップ」欄に .svg ファイルをドラッグするか、クリックして選択します。
- 「プレビュー」タブで表示を確認できます。背景(市松・白・黒)を切り替えて透過部分を確認できます。
- 「ソース」タブでSVGのコードを確認・コピーできます。
- プレビューはマウスホイールで拡大・縮小、ドラッグで移動、ダブルクリックで「フィット↔100%」を切り替えられます。
- 倍率(1x/2x/4x)を選び「PNGでダウンロード」を押すと、指定サイズのPNG画像として保存できます。
❓ よくある質問
スクリプトはどう扱われますか(安全対策)
SVGにはJavaScriptを埋め込めるため、表示前に安全対策として <script> や <foreignObject> 要素、on〜(onclick等)のイベント属性、javascript: で始まるリンクを自動的に除去します。除去後のソースは「ソース」タブで確認・コピーできます。
PNGに変換できないことがあるのはなぜですか
外部の画像・フォント・スタイルシートを参照しているSVGは、ブラウザのセキュリティ制約によりcanvasへ描画できず(キャンバスが汚染され)、PNGへ変換できない場合があります。参照を埋め込み(data URI化)にすると変換できることがあります。
幅・高さやviewBoxが表示されないのはなぜですか
SVGにwidth/height属性が指定されていない場合は「-」と表示されます。その場合はviewBoxのサイズを基準にプレビュー・PNG変換を行います。どちらもない場合は既定サイズ(300×150)で処理します。
ファイルはサーバーに送信されますか
いいえ。SVGの解析・サニタイズ・描画・PNG変換はすべてお使いのブラウザ内で完結し、ファイルがサーバーへアップロードされることはありません。オフライン(file://)でも動作します。