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()などに埋め込めます。
このページをシェア
