SVG圧縮・軽量化ツール

SVG圧縮でコードや.svgファイルから不要なコメント、メタデータ、空白を削除し、ファイルサイズを軽くします。

⌘ ブラウザ実行 ◴ データ非保存 ⌁ 無料

コンセプト

SVG圧縮で見た目を維持しつつWeb配信向けに軽量化する

SVG圧縮は、公開前に不要なXML宣言やコメント、空白を除去して転送量を下げるための前処理です。

SVGファイルをデプロイ前に処理することで、読み込み速度向上に寄与します。主にXML宣言、コメント、メタデータ、重複空白を整理します。

アイコンセットやイラスト資産を多数配布する場合、軽量化効果が大きく、ページ数やメール配信の帯域で恩恵が出ます。

利用シーン

インラインSVGのアイコン・ボタン・バッジ・バナーイラストなどを複数ページで配布する前に使われます。

何を整理するか

XML宣言、doctype、コメント、metadataを削除し、要素間・等号周辺の空白や重複空白を整理してSVGコードを短くします。

最終確認ポイント

最適化前後でviewBox・形状・アクセシビリティ属性(aria-labelやrole等)が維持されているかを事前に比較します。

配布前に外観(形状・サイズ・整列)とスクリーンリーダ向け情報の欠落がないかを確認してから反映してください。

SVG圧縮・軽量化ツール SVG最適化ワークスペース

SVG入力
最適化されたSVG

使い方

  1. 1 SVGコードを貼り付けるか、SVGファイルを入力エリアにドラッグします。
  2. 2 SVGを圧縮・軽量化して、コメント、metadata、doctype、不要な空白を削減します。
  3. 3 プレビューとサイズ変化を確認し、圧縮されたSVGをコピーまたはダウンロードします。

主な使用例

  • SVGファイルを圧縮
  • SVGコード圧縮
  • SVGのコメントとメタデータを削除
  • Web用アイコンのSVGファイルサイズを削減
  • 最適化されたSVGをプレビューしてダウンロード

よくある質問

SVGファイルを圧縮できますか?

はい。SVGコードを貼り付けるか.svgファイルをドロップして入力欄に読み込み、その後に圧縮・軽量化を実行します。

SVG圧縮では何を削減しますか?

XML宣言、コメント、doctype、metadataタグを削除し、空白を整理してSVGコードを短くします。

結果をコピーまたはダウンロードできますか?

はい。圧縮・軽量化されたSVGコードをコピーするかoptimized.svgとしてダウンロードでき、プレビューも表示されます。

関連ワークフロー