SVGミニファイアー
外観を変えずに SVG サイズを縮小します。 Web パフォーマンスと軽量アイコン配信に最適です。 SVG ファイルを開いてすぐに処理できます。
SVG ファイルをドラッグ&ドロップ
またはクリックして選択、もしくは SVG コードを貼り付け
SVG ミニファイアを使用する理由
空白の削除
SVG ミニファイアーはスペース、タブ、改行を削除してバイト数を減らします。これは、SVG が HTML または CSS にインライン化されており、すべての文字が重要である場合に理想的です。また、JSON または CMS フィールドに埋め込まれた SVG のサイズも削減されます。
ビジュアルセーフ
書式設定のみが変更されるため、出力ではレンダリングが維持されます。パス、塗りつぶし、グループは変更されないため、視覚的な結果はブラウザ間で同じままになります。これにより、デザイン レビューは実際の視覚的な変更に重点を置くことができます。 SVG ミニファイアは、ジオメトリや色を変更しないため、ビジュアル QA の前に安全に実行できます。
小さいファイル
SVG ミニファイアは、多くのインライン アセットを含むアイコン セット、マーケティング ページ、UI キットのペイロード サイズを削減するのに役立ちます。ファイルが小さいほど読み込みが速くなり、パフォーマンス メトリクスが向上します。これは、モバイルでのパフォーマンスの予算を満たすのに役立ちます。
SVGO 搭載
SVG ミニファイアは、信頼性の高い空白の削除のために SVGO を使用します。これにより、ファイル間で結果の一貫性が保たれ、危険な属性変更が回避されます。 CI ワークフローでは予測可能です。
インスタントエクスポート
処理後、SVG ミニファイアを使用すると、ファイルを即座にダウンロードまたはコピーできます。これにより、結果をリポジトリまたはパイプラインに簡単にドロップできます。結果をチケットに直接貼り付けることができます。
ローカル処理
すべてがブラウザ内で実行されるため、ファイルがアップロードされることはありません。これにより、個人資産が安全に保たれ、オフライン作業がサポートされます。また、大規模なアセットのアップロードに時間がかかることも避けられます。ローカル実行は、ロックダウンされたネットワークでもうまく機能します。
SVG を縮小する方法
SVG をアップロードする
ファイルをドラッグ アンド ドロップするか、マークアップを貼り付けて開始します。 SVG ミニファイアはローカルにロードされ、プレビューが表示されるため、エクスポートする前にソースを確認できます。デザイン ツールから生のエクスポートまたはスプライトを貼り付けることができます。 SVG ファイルを開いてすぐに処理できます。
コードを縮小する
縮小ステップを実行して、すべての属性を維持しながら空白を削除します。これにより、デザイン システムとスクリプトの出力が安定した状態に保たれます。 SVG minifier は、リリース前に出力を標準化するのに役立ちます。読み取り可能な差分が必要な場合は、まずフォーマットしてから縮小してください。
SVGをダウンロードする
縮小されたファイルを即座にエクスポートします。 SVG ミニファイアーはファイル名の一貫性を保つため、プロジェクト全体でアセットを簡単に置き換えることができます。出力をコミットまたはインライン化する準備ができました。
SVG ミニファイアに関するよくある質問
オンライン SVG minify によって SVG の見た目は変わりますか?
SVG の縮小と最適化: 違いは何ですか?
IDやviewBoxは変更されるのでしょうか?
縮小されたSVGをダウンロードできますか?
SVG はサーバーにアップロードされていますか?
縮小する前にフォーマットまたはクリーンアップする必要がありますか?
縮小するとアクセシビリティに影響しますか?
インラインSVGに使用できますか?
大きいファイルや複雑なファイルについてはどうすればよいでしょうか?
読み取り可能なバージョンを保持する必要がありますか?
SVG Minifier はダウンロードせずに無料で使用できますか?
SVG Minifier を使用するにはアカウントが必要ですか?
関連する SVG ツール
SVG ミニファイアをこれらのツールと組み合わせて、アセットをクリーンアップ、最適化、または変換します。予測可能な結果を得るために、これらを順番に使用してください。