SVG最適化ツール
エディターのメタデータ、不要なグループ、余分な小数点以下を取り除いてSVGを軽量化。前後のプレビューを並べて確認できるので、見た目が崩れる心配はありません。
- アップロード不要
- オフライン対応
- 無料・登録不要
- ファイルはブラウザの外に出ません
SVGファイルをここにドロップ
またはエディターにSVGコードを貼り付けてください。 複数のファイルを同時に開けます。
SVGはこのデバイスに残ります。何もアップロードされません。
SVG最適化ツールの使い方
- 1
SVGを開く
Figma、Illustrator、Inkscape、Sketchから書き出したSVGファイルを1つまたは複数ドロップします。
- 2
設定を調整
数値の精度や、IDの保持、width・heightの削除などのオプションを調整します。前後のプレビューがすぐに更新されます。
- 3
適用またはダウンロード
結果をエディターに適用する（元に戻せます）か、コピー、または最適化したファイルをダウンロードします。
SVG最適化ツールが取り除くもの
デザインツールはブラウザが使わないコードを大量に書き出します。最適化ツールは画像の見た目をそのままに、それらを取り除きます。
- エディターのメタデータ、コメント、Illustrator・Inkscape・Sketchの名前空間
- 非表示や空の要素、使われていない
defs、不要なグループ - 座標の余分な小数点以下（精度スライダーで調整）
- 長いパスコマンド（同等の短い形に書き換え）
- デフォルトの属性値と重複したスタイル
SVGファイルを最適化する理由
SVGが小さいほど読み込みが速くなり、Core Web Vitalsの改善につながります。特にHTMLに埋め込むインラインSVG、アイコンスプライト、Reactコンポーネントでは、1バイトごとにJavaScriptバンドルに含まれるため重要です。コードがすっきりすれば、読みやすく、色の変更やアニメーションもしやすくなります。
元のサイズだけでなくgzip後のサイズも確認しましょう。サーバーが実際に送るサイズに近い数値です。
SVG作業に必要なものがすべて揃っています
SVG最適化ツールは、SVGファイルの表示・編集・最適化・変換をひとつにまとめたワークスペースの一部です。登録不要、広告なし、アップロードなし。
すぐにプレビュー
最大6400%までズーム、パン、画面に合わせる表示、透明・白・黒・任意の背景色でSVGを確認できます。
ライブコードエディター
シンタックスハイライト、エラー行の表示、整形と圧縮、検索、完全な元に戻す履歴。
アウトラインとピクセルグリッド
アウトラインモードですべてのパスを確認し、拡大時はグリッドでピクセルの位置合わせをチェックできます。
情報の確認
ファイルサイズとgzipサイズ、viewBox、ホバーでハイライトされる要素ツリー、ワンクリックの色置き換え。
SVGOで最適化
前後のプレビューを比べながら、精度を調整してファイルを軽量化。開いているすべてのファイルを一括最適化できます。
PNG・JPG・WebP・ICO
最大16384pxまで任意のサイズで、透明度を保ったまま書き出し。PNGを直接クリップボードにコピーすることもできます。
React・Vue・Svelte
currentColorやpropsに対応した、きれいなJSX/TSX、React Native、Vue、Svelteコンポーネント。
複数ファイルを同時に
多数のSVGをタブで開き、一括最適化したり、SVGやPNGのZIPとしてダウンロードできます。
プライベート＆オフライン
アップロードもアカウントも不要。作業内容はブラウザに保存され、初回訪問後はオフラインでも動作します。
よくある質問
SVGはどのくらい小さくなりますか？
デザインツールから書き出したファイルは、SVGOがメタデータ、コメント、非表示要素、余分な小数点以下を取り除くため、30〜80%小さくなることがよくあります。正確な削減量は適用前に表示されます。
最適化するとSVGの見た目は変わりますか？
デフォルト設定はほとんどのファイルで安全です。精度を大きく下げる場合は、前後のプレビューを比較してください。CSSやJavaScriptで要素のIDを参照している場合は「IDを保持」をオンにしてください。
SVGOとは何ですか？
SVGOは最も広く使われているオープンソースのSVG最適化ツールです。viewsvgはそれをブラウザ内で実行するので、ファイルがデバイスの外に出ることはありません。
SVGファイルはどこかにアップロードされますか？
いいえ。viewsvgは完全にブラウザ内で動作します。ファイルの読み込み、表示、最適化、変換はすべてお使いのデバイス上で行われ、サーバーには何も送信されません。初回訪問後はオフラインでも使えます。
viewsvgは無料ですか？
はい。すべての機能が無料で、登録不要、透かしなし、ファイル数の制限もありません。