無料のSVG最適化ツール

このページにSVGをドロップすると、最適化ツールがエディタデータ、メタデータ、コメント、非表示の図形、余分な空白を削除します。プレビューと統計バーに表示される削減サイズを確認してから、「ダウンロード」をクリックして小さくなったファイルを入手してください。

当社のサンプルファイルでは、ファイルの出どころによって約1%から80%まで幅があります。エディタデータだらけのInkscape風ロゴは80%小さくなり、すっきりした24 pxのアイコンは1%小さくなりました。SVGの中に埋め込まれた写真は小さくなりません。

通常は変わりません。図形、色、パスの座標はそのまま保たれます。注意が必要なのは「非表示要素を削除」で、不透明度が0の図形やdisplay noneに設定された図形は、CSSやスクリプトであとから表示される場合でも削除されます。ダウンロードする前に、2つのプレビューを比較してください。

原因はおそらく「IDを整理」です。未使用のIDを削除し、残りのIDをaやbのような短い名前に変更するため、SVGの外にあるCSSやスクリプトが探しているIDと一致しなくなります。SVG自体にstyleタグやscriptタグがある場合は、「IDを整理」はIDをそのまま残します。IDを保持するには、「IDを整理」をオフにしてください。

「メタデータを削除」はメタデータブロックを削除します。「コメントを削除」はコード内のコメントを削除します。「グループを統合」は何の働きもないグループを解除します。「IDを整理」はIDを短くするか削除します。「非表示要素を削除」は見えない図形と未使用の定義を取り除きます。「パスを結合」は同じスタイルを持つ隣り合ったパスをつなげます。

はい。viewBox、width、height、title、descタグは常に残るため、SVGの拡大縮小やテキストラベルは維持されます。ただし注意点があります。「IDを整理」をオンにするとtitleのIDが削除され、aria-labelledbyによる参照が機能しなくなります。そのようなファイルでは「IDを整理」をオフにしてください。

いいえ。パスの座標は丸めないため、重要な桁が削られることはなく、色も書き換えません。「パスを結合」は2つのパスをつなぐときにパスのコードを書き換えるので、10.000000が10になることはありますが、値は変わりません。そのため、小数点以下の桁が長いファイルは、ここでは縮小幅が小さくなります。

ファイルが有効なSVGコードではありません。最適化ツールはファイルをテキストとして読み込み、閉じられていないタグなどの壊れたマークアップがあると処理を止めます。メッセージには行と列が示されます。テキストエディタでその箇所を修正してから、もう一度ファイルを追加してください。

はい。プレビューの下にある「コード差分を表示」をクリックすると、元のコードと最適化後のコードを左右に並べて表示できます。変更箇所をハイライトするのではなく、両方のファイル全体を表示します。最適化後のコードは1行の長いコードに圧縮されています。

いいえ。このツールで扱えるのは一度に.svgファイル1つだけで、コードを貼り付ける入力欄もありません。2つのファイルをドロップすると、ファイル形式が違う場合と同じエラーが表示されます。圧縮された.svgzファイルは受け付けないため、先に通常の.svgに展開してください。多数のファイルをまとめて整理するには、SVG一括最適化ツールをご利用ください。

ブラウザ内でSVGO 4を実行しますが、デフォルトのプリセットではなく、13個のプラグインを固定で使用します。そのうち6つはエディタ内のスイッチです。残りの7つは常に実行され、エディタデータ、XMLヘッダー、doctype、空のタグを削除します。

いいえ。SVGの読み込みと最適化はこのブラウザタブ内で行われ、結果はそのままダウンロードに保存されます。ページは、どのスイッチがオンだったかやおおよそのファイルサイズといった匿名の利用統計を送信しますが、SVGコードやファイル名は送信しません。