SVG を分割
☞ すべてブラウザ内で処理 — アップロードは一切ありませんここに SVG をドロップ
またはクリックして選択 — SVG のみ
パーツ
SVG を分割
1 つの SVG を最上位のパーツに分けます。グループ・シンボル・図形をすべてプレビューし、必要なものにチェックを入れて、個別ファイルとして持ち出せます。
またはクリックして選択 — SVG のみ
パーツ
パーツごとに 1 ファイル
分割されるのはファイルの最上位だけで、しかも実際に何かを描いている要素だけです。グループ、シンボル、パス、図形、テキスト、画像が対象です。グラデーション・フィルター・マスク・スタイルシートは描画ではなく定義なので、単体で一覧に出ることはありません。グラデーションだけのファイルは真っ白になってしまうからです。
書き出される各パーツは、元ファイルの定義とスタイルを丸ごと引き継ぎます。そのぶん各ファイルは必要以上に大きくなりますが、これは意図的な取引です。グラデーションが欠けた小さいファイルより、元の中とまったく同じに描画されるパーツのほうが価値があります。使われていない部分は SVG 最適化ツールに通して落としてください。
3 ステップ
.svg ファイルを選びます。ファイルは端末内に留まります。
各パーツは書き出されるとおりの姿でプレビューされます。
1 つならそのまま、複数なら ZIP でまとめて届きます。
かんたん回答
defs ブロックとスタイルシートをまるごと持っていくからです。ある図形が実際にどのグラデーションやフィルターを使っているかを推測すると、静かに間違えます。そこで全パーツに一式を持たせています。使われていない部分は SVG 最適化ツールが一度で取り除きます。
おそらく絵全体が 1 つのグループに入っていて、それが 1 パーツと数えられています。分割は意図的に最上位までに限定しています。さらに深く潜ると、ふつうのイラストから何百もの断片ができてしまうからです。
使えます。むしろ最も得意なケースです。スプライト内の各シンボルは、そのシンボル自身の viewBox を使った単独ファイルになるので、真っ白なキャンバスではなく、きちんと切り取られたアイコンが 1 ファイルずつ得られます。
いいえ。各パーツは元の viewBox をそのまま保つので、絵全体の中にあったときと同じ位置・同じ縮尺のままです。詰めたい場合は、あとから SVG クロップツールを使ってください。
最上位のパーツは先頭 100 個までが一覧に出ます。それを超えると、プレビューの生成にかかる時間が分割の価値を上回ります。先にファイルを統合するかグループ化してください。
いいえ。解析も分割もブラウザ内で行われ、ZIP もそこで作られます。