SVG を結合
☞ すべてブラウザ内で処理 — アップロードは一切ありませんここに SVG ファイルをドロップ
またはクリックして選択 — SVG ファイル 12 個まで
プレビュー
OneImageTool
無料画像ツール
SVG を結合
複数の SVG ファイルを 1 つにまとめます。横並び・縦並び・グリッド・重ね置きから選べ、各ファイルはグラデーション・フィルター・スタイルをそのまま保ちます。
またはクリックして選択 — SVG ファイル 12 個まで
プレビュー
ファイル同士が干渉しない
2 つの SVG ファイルがそれぞれ完全に正しくても、同じ文書に同居した瞬間に壊れることがあります。どちらも id が "a" のグラデーションを定義しているかもしれませんし、どちらも何もかもを .st0 と名付ける Illustrator のスタイルシートを抱えているかもしれません。単純に連結すると、2 つ目のグラデーションは静かに 1 つ目を参照し、スタイルシートは互いを上書きします。ファイルは問題なく開き、ただ見た目だけがおかしくなります。
このツールは、各ソースファイルのすべての id とクラス名に専用の接頭辞を付け、参照側もまとめて書き換えます。url() の値、href のフラグメント、インラインスタイル、style 要素内のセレクターまで対象です。そのうえで各ファイルを入れ子の svg に配置し、その座標系専用のビューポートを与えます。
3 ステップ
.svg ファイルを 12 個まで追加できます。ファイルは端末内に留まります。
横並び・縦並び・グリッド・重ね置きから選び、間隔を指定します。
すべてを含んだ 1 つの SVG になります。
かんたん回答
残ります。各ファイルの id には接頭辞（f1-、f2- など）が付き、それらへの参照もすべて書き換わるので、どちらも url(#a) を使っていた 2 つのファイルが 1 つの定義を奪い合うことなく、それぞれ自分の定義を指すようになります。
同じ扱いです。Illustrator や Figma の書き出しはほぼすべてを .st0 や .cls-1 と名付けるため、実際には id の衝突よりクラスの衝突のほうがよく起きます。class 属性と style 要素内のセレクターに、まとめて接頭辞が付きます。
変えられます。ファイル一覧の矢印を使ってください。一覧の順序がそのままレイアウトの順序（左から右、上から下）になります。
されません。各ファイルは自分の寸法のまま配置されます。横並びでは垂直方向に中央揃えになり、グリッドでは最大のファイルに合わせたセルサイズになります。大きさをそろえたい場合は、先に SVG リサイズツールをお使いください。
すべてのファイルを同じ位置に中央揃えで重ねます。アイコンにバッジを重ねたいときや、同じ図の 2 つのバージョンを見比べたいときに便利です。
いいえ。解析も組み立てもすべてブラウザ内で行われます。