Adobe Illustrator・Figma・Inkscapeが書き出す不要なメタデータ、XMLコメント、非表示レイヤー、過剰な小数点座標をブラウザ内ローカル処理で一括クリーンアップします。
またはクリックしてファイルを選択
Adobe Illustrator、Figma、Inkscapeから書き出した実際のベクターデータでのファイルサイズ削減結果です。
21 KBにおよぶAdobe XMPヘッダー情報、<i:pgf>独自タグ、未使用のXML名前空間を完全削除。さらに4,200個以上のパス座標を小数点6桁から2桁へ丸め、400%拡大時も視覚的なズレはゼロです。
ドラッグ＆ドロップ一括処理により、冗長なグループ入れ子構造やデフォルト属性（fill-opacity="1"など）を整理し、<style>タグを最小化。アイコン全体の容量を約3分の1に圧縮しました。
inkscape:* や sodipodi:* などのエディタ専用属性と、デザイナーが残した14個の非表示ガイドレイヤーを削除。ブラウザでのDOMパース時間を68%短縮しました。
Illustrator、Figma、Sketch、Inkscapeなどのデザインツールは再編集性を優先するため、書き出されたSVGにはWeb表示に不要な独自XMLタグや7桁の浮動小数点座標が大量に含まれています。
未圧縮のSVGをHTMLへインライン埋め込みすると、HTMLサイズとDOMノード数が肥大化します。不要なメタデータやコメントを除去することで、ページの初期描画（FCP/LCP）を高速化できます。
書き出し直後のSVGに含まれる xmlns:xlink やエディタ固有のID属性は、JSXのコンパイル警告やCSS干渉の原因になります。不要属性を削ぎ落とした軽量なXMLをすぐに出力できます。
公開前のロゴやデザインシステムの大量アイコンも、ブラウザ内のローカルJavaScript処理だけで一括軽量化できるため、外部サーバーへの情報漏洩リスクが一切ありません。
表示崩れを防ぎつつ最大の圧縮効果を得るため、以下の条件を満たすSVGファイルをご用意ください。
Illustrator、Figma、Affinity Designer、Inkscapeなどから書き出したXMLベースの .svg ファイルに対応しています。数十個のファイルをまとめてドロップ可能です。
<path>、<circle>、<rect>などのベクター要素で構成されたSVGが対象です。内部に <image xlink:href="data:image/png;base64,..."> のようなビットマップ画像が埋め込まれている場合、XML最適化では画像部分の容量は減りません。
特殊なフォントを使用している場合は、書き出し前にデザインソフト側で「アウトラインを作成」してベクターパスに変換しておくと、閲覧環境によるフォント置き換わりを防げます。
レスポンシブに拡大縮小できるよう、ルートの <svg> タグに viewBox="0 0 W H" 属性が正しく設定されていることを確認してください。
画面中央の8つのチェックボックス（コメント削除、メタデータ削除、空属性削除、スタイル最小化、未使用名前空間の削除、数値の丸め、エディタデータ削除、非表示要素の削除）を確認します。初期状態ではすべてオンになっています。
緑色のドロップゾーンに .svg ファイル（複数可）をドラッグ＆ドロップするか、「軽量化前のサンプルSVGを試す」ボタンをクリックして動作を確認します。
数ミリ秒でローカル処理が完了し、ファイルごとに「元のサイズ」「最適化後のサイズ」「削減率（%）」が一覧表示されます。
各ファイルのダウンロードボタンを押して、クリーンアップ済みの .svg ファイルを保存し、Webサイトやアプリ開発にそのまま組み込みます。
余分なデータが取り除かれた軽量SVGファイルは、モダンなWeb制作やアプリ開発のあらゆる場面でそのまま利用できます。
スリム化された <svg> コードをJSXやVueテンプレートに直接貼り付け、currentColor やTailwind CSSクラスでアイコンの色やホバーアニメーションを自在に制御できます。
コード量が最大80%減るため、CSSの background-image に埋め込む data:image/svg+xml 文字列が大幅に短くなり、スタイルシート全体の読み込みが速くなります。
不要な名前空間やゴミ属性を除去してから当サイトの「SVG PNG 変換」や「画像からアイコン作成」に読み込ませることで、パースエラーや描画ズレを確実に防げます。
通常のアイコンやイラストでは全オプション有効で問題ありませんが、以下のような特殊なSVGでは一部のチェックを外して実行してください。
「非表示要素を削除」をオンにすると、display="none" や opacity="0" の要素が削除され、後からJS（GSAPなど）やCSSで表示させるアニメーションが動かなくなります。
アニメーション用SVGを最適化する際は、「非表示要素を削除」と「エディタデータを削除」のチェックを外してからアップロードしてください。
12×12のような非常に小さな座標空間に描かれたベクターパスでは、座標の小数点を丸めると相対的な制御点の移動量が大きくなり、曲線がカクつくことがあります。
16×16未満の極小viewBoxアイコンでは「数値を丸める」のチェックを外すか、デザインソフト側でアートボードを24×24や512×512に拡大して書き出してください。
Illustrator等にビットマップ画像を配置してSVG保存した場合、ファイル容量の99%は画像文字列であり、XMLタグを整理してもサイズはほとんど減りません。
埋め込み画像は当サイトの「PNG 圧縮ツール」で圧縮するか、ベクターソフトの「画像トレース」機能で本物のベクターパスに変換してください。
目的に応じて最適なツールを使い分けることで、ベクター素材の制作ワークフローを効率化できます。
| 比較項目 | SVG オプティマイザー（当ツール） | オンライン SVG ビューア | SVG PNG 変換 / 一括変換 |
|---|---|---|---|
| 主な目的 | 不要なXMLコードやメタデータを除去して .svg 容量を削減 | 背景色切り替えプレビュー、viewBox確認、XMLコードの整形 | ベクターの .svg を指定ピクセルサイズの PNG/JPG/WebP 画像に変換 |
| 出力フォーマット | 軽量化された .svg ベクターファイル（拡大しても劣化しない） | 読みやすくインデント整形されたXMLコード＆プレビュー | .png / .jpg / .webp ラスター画像（または .zip 一括保存） |
| ファイルサイズへの影響 | 見た目を変えずにファイル容量を40%〜80%削減 | 圧縮は行わず、1行に圧縮されたコードを人間が読みやすい形に展開 | 指定した出力ピクセル解像度（1024px、4Kなど）に依存 |
| おすすめの活用場面 | Webサイト公開前のアイコン・イラストの容量ダイエット | SVGの表示崩れ、白飛び・黒潰れ、viewBox切れのデバッグ | SVG非対応のWord・PowerPoint・SNS・入稿システムへの画像提出 |
一切劣化しません。SVGは数式で線や色を表現するベクター形式です。当ツールが削除するのはXMLコメントやデザインソフト固有の編集履歴（Adobe XMPなど）、未使用の名前空間であり、ベクターの描画品質はそのまま維持されます。
主に2つの原因が考えられます。1つ目は、すでにSVGO等で圧縮済みのSVGである場合。2つ目は、SVGの中にBase64形式のラスター画像（<image>タグ）が埋め込まれている場合です。「SVG ビューア」でコードを開き、長い文字列が含まれていないか確認してみてください。
非表示属性や空属性を持つ要素が削除された可能性があります。「最適化オプション」にある「非表示要素を削除」と「空の属性を削除」のチェックを外してから、もう一度元のSVGファイルをドロップしてください。
完全に安全です。ファイルの読み込みからXML解析、圧縮処理まで100%お使いのブラウザ内（JavaScript）で完結し、外部サーバーへファイルが送信・保存されることは一切ありません。
はい、可能です。ドロップゾーンに複数の .svg ファイルを同時にドラッグ＆ドロップすると、すべてのファイルが瞬時に処理され、個別の削減率レポートとダウンロードボタンが表示されます。
用途ごとに特化したブラウザ完結型ツールと連携して作業を効率化できます。
SVGファイルのプレビュー表示、背景色切り替え、viewBox・サイズ確認、XMLソースコードの整形・コピー。
SVGを透明背景維持のまま高画質PNGへ変換。ピクセルサイズ指定・4倍拡大・印刷用300DPI設定に対応。
複数のSVGファイルを一度にPNG・JPG・WebPへ一括変換し、ZIPアーカイブとしてまとめてダウンロード。
1枚の画像からWeb用 favicon.ico や iOS/Android/Windows 用アプリアイコン一式を自動生成。