Resize an SVG
Choose an SVG and type the width and height you want, in px, mm, cm or in. The drawing scales to the new size and nothing is cut off.
Free, no account. The file is read by code running in your browser. It is not uploaded, and nothing about it is stored.
How to resize an SVG
- Choose your SVG, drop it on the box, or paste SVG code.
- Pick the unit: px for screens, mm, cm or in for anything that will be printed, cut or engraved.
- Type the width or the height. With “Keep proportions” ticked the other follows.
- Check the new size, shown in pixels, millimetres and inches, and download the SVG.
What the tool changes
Three attributes on the outer <svg> element and nothing else: width, height and, only if the file has none, viewBox. Every path, shape, colour and id in the file is written back exactly as it was, character for character.
The viewBox is what makes this work. It names the rectangle of the drawing’s own coordinates that the width and height should show. A file with width="200" height="200" and no viewBox, changed by hand to 400 × 400, gives a 400 pixel frame with the drawing still 200 pixels wide in its top left corner; shrink it instead and the drawing is cut off. So when a file has no viewBox, this tool adds one equal to the old size, viewBox="0 0 200 200" in that example, and the drawing then fills whatever size you set. A viewBox that is already there is left alone.
Pixels, millimetres, centimetres and inches
SVG uses the CSS units, which are tied together by fixed ratios: 1 in is 96 px and 25.4 mm. A width of 100 mm is therefore 377.95 px, and 4 in is 384 px. The tool shows every size all three ways.
For a real-world size, write it in real-world units. A width of 100mm is read as 100 millimetres by Inkscape, Illustrator and laser software such as LightBurn. A bare pixel number is less certain: the standard says 96 pixels to the inch, but some programs have counted 72 or 90, so a file sized only in pixels can come in at a different physical size from the one you meant.
Changing the proportions
With “Keep proportions” unticked you can set any width and height. The drawing is not stretched to match. SVG scales it evenly until it fits inside the new frame and centres it, leaving empty space at the sides or above and below. That is the standard behaviour of a viewBox, and the tool tells you when it applies.
Two settings inside a file change this, and the tool warns about both: preserveAspectRatio="none" stretches the drawing, and a value ending in slice fills the frame and cuts off what overflows.
What resizing does to the drawing
- Sharpness: nothing. An SVG is a list of shapes, not pixels, so it is as crisp at 4,000 pixels as at 40.
- Line widths: they scale with everything else. A stroke 2 units wide in a drawing shown at twice the size is drawn twice as thick.
- File size: the same, give or take a few bytes for the new numbers.
- Text: it scales with the drawing, like any other shape.
Questions
Does resizing an SVG lose quality?
No. The shapes are stored as coordinates, and the new width and height only say how large to draw them. You can resize the same file as often as you like, up or down.
Why is my SVG cut off after I changed its width and height?
It has no viewBox, so the browser draws the shapes at their original size and crops them to the new frame. Resize the original file here and a viewBox is added for you.
How do I resize an SVG for a cutting machine or a laser?
Set the unit to mm or in and type the size you want made. Most cutting and laser programs also let you change the size after opening the file, because a vector scales without loss.
Can I resize an SVG with CSS instead?
Yes, if the file has a viewBox: set width and height on the <img> or <svg> in your style sheet and the drawing follows. Without a viewBox it will not scale, which is the case this tool fixes.
How do I make the file smaller in bytes?
That is a different job. Resizing changes the size it is drawn at, not the size of the file. Use the SVG optimizer.