merge SVG
☞ runs entirely in your browser — nothing is uploadedDrop your SVG files here
or click to browse — up to 12 SVG files
Preview
merge SVG
Combine several SVG files into one. Arrange them in a row, a column, a grid or stacked — each file keeps its own gradients, filters and styles.
or click to browse — up to 12 SVG files
Preview
no bleeding between files
Two SVG files can each be perfectly valid and still break the moment they share a document. Both may define a gradient with id "a", and both may carry an Illustrator stylesheet where everything is called .st0. Concatenate them and the second gradient quietly resolves to the first, while one stylesheet overrides the other — the file opens fine and simply looks wrong.
This tool renames every id and class in each source file with its own prefix and rewrites every reference to match: url() values, href fragments, inline styles and the selectors inside style elements. Each file is then placed in its own nested svg, which gives it a private viewport for its coordinate system.
three steps
Add up to 12 .svg files — they stay on your device.
Row, column, grid or stacked, with the spacing you want.
One SVG containing all of them.
quick answers
Yes. Each file's ids get a prefix (f1-, f2- and so on) and every reference to them is rewritten, so two files that both used url(#a) end up pointing at their own definitions instead of fighting over one.
Those get the same treatment. Illustrator and Figma exports name almost everything .st0 or .cls-1, so class collisions are more common than id collisions — the class attributes and the selectors inside style elements are prefixed together.
Yes — use the arrows in the file list. The order there is the order in the layout, left to right and top to bottom.
No. Each keeps its own dimensions and is placed as-is; in a row they are centred vertically, in a grid every cell is as big as the largest file. Use the SVG resizer first if you want them to match.
It puts every file at the same spot, centred on top of each other — handy for overlaying a badge on an icon, or for comparing two versions of the same drawing.
No. Everything is parsed and assembled in your browser.