本文へスキップ
にゃんこツール

SVG最適化(SVGO)

SVGファイルを選択するかSVGコードを貼り付けると、SVGOで不要な情報を取り除いて軽量化します。ビットマップ画像のサイズ変更・圧縮は画像リサイズ・圧縮、SVGをCSSなどに埋め込みたい場合は画像のBase64(Data URL)変換もご利用ください。

🔒 ブラウザ内で完結・入力データはサーバーに送信されません

ここにSVGファイルをドラッグ&ドロップすることもできます

.svgファイルを選ぶか、下の入力欄にSVGコードを貼り付けてください。

最適化オプション

注意事項

  • 最適化にはSVGOを使用しています。メタデータや不要な属性・空白を取り除くほか、数値の精度も調整するため、非常に細かい図形では見た目に差が出ることがあります。
  • 最適化の前後は、プレビューで見た目を確認してから使ってください。
  • ファイルはブラウザ内で処理され、サーバーには送信されません。

用語解説

SVG

XMLベースのベクター画像形式です。拡大しても劣化せず、ロゴやアイコンによく使われます。デザインツールが書き出したSVGには編集用のメタデータなど、表示に不要な情報が多く含まれがちです。

SVGO

SVGを最適化するオープンソースのツールです。コメントや不要な属性の削除、パスデータの短縮などで、見た目を変えずにファイルサイズを減らします。

viewBox

SVGの描画座標系を定める属性です。width/heightを削除してviewBoxだけにすると、表示先のサイズに合わせて自由に拡縮できます。

よくある質問

SVGを最適化すると見た目は変わりますか?

通常は変わりません。SVGOでエディタのメタデータや不要な属性、空白などを取り除きます。ただし数値の精度を落とすため、非常に細かい図形では差が出ることがあるので、結果を必ず確認してください。

PNGやJPEGにも使えますか?

いいえ。このツールはSVG専用です。PNGやJPEGなどのビットマップ画像のサイズ変更や圧縮は、画像リサイズ・圧縮ツールをご利用ください。

最適化したSVGをCSSに埋め込むにはどうしますか?

画像のBase64(Data URL)変換ツールでData URLにすると、CSSのurl()などに埋め込めます。

このページをシェア

↑↓ 選択 Enter 開く Esc 閉じる