Barokit

🎨SVGミニファイア

SVGファイルからコメント・余分な空白・エディタメタデータを削除してサイズ削減。

🔒 ブラウザ内処理ウォーターマークなし登録不要

使い方

  1. 1SVGコードを貼り付けます。
  2. 2最適化ボタンを押します。
  3. 3結果をコピーしてウェブで使用します。

よくある質問

どこまで削減できますか?+

通常30〜60%程度削減されます。Illustrator・Figmaの出力SVGはメタデータが多くより大きな効果が得られます。

デザインが変わりますか?+

いいえ。視覚的には同じで、容量と可読性のみが減少します。Path・座標はそのままです。

SVGとPNGどちらが良いですか?+

アイコン・ロゴ・イラストはSVG(ベクター、無限拡大可能)。写真はPNG・WebPが効率的です。

SVGOと同じツールですか?+

類似機能を提供します。SVGOはより多くのオプション(プラグイン)を持ち、ビルド自動化に適しています。

Pathデータも圧縮されますか?+

基本的な圧縮は空白・コメント除去が中心です。d属性のパスデータ短縮はSVGOのような専門ツールでより強力です。

Reactコンポーネントにインライン化するとき?+

最適化したSVGをJSXにそのまま貼り付けるだけです。style・classをReact表記(camelCase)に変更する必要があるかもしれません。

関連ツール