Resize SVG Images

An SVG logo or drawing declares its own width and height, and sometimes that size does not suit the page, app or template you are using it in. This page rewrites that size for you. The file you get back is still an SVG, still made of shapes and not pixels, so nothing turns blurry. The work happens in your browser and the file is not uploaded.

Drop images here, click to choose, or paste with Ctrl+V
SVG files · the file type stays the same · many files at once · nothing is uploaded

How to resize SVG images

  1. Add your SVG files by dropping them, clicking the drop zone or pasting.
  2. Choose the new size: a percentage, a maximum width and height, or an exact size. The quick sizes fill in common values.
  3. Press Resize and compare the old and new size of each file. The file type stays the same.
  4. Download each file or all of them as a ZIP.

When to resize, and when not to

  • A template or app wants an SVG of a certain width and height and yours declares something else.
  • An SVG is missing a size or uses percentages, and you want it to carry fixed dimensions.
  • You need several copies of one drawing at different sizes without redrawing it.
  • Do not use this to make an image file smaller: an SVG is text, so changing its size barely changes its weight. Convert to a bitmap if you need that.

What changes

  • The file stays an SVG. The download is named with the new size, like logo-512x512.svg.
  • Only the declared width and height are rewritten. The viewBox is kept, or created from the old size when the file had none, so the whole drawing scales with it.
  • Fit inside, Fill and crop and Stretch are applied through the SVG's own preserveAspectRatio setting, which is what the standard provides for this.
  • Percent and Max size scale the declared width and height; if those are percentages or missing, the viewBox size is used as the starting point.
  • The quality slider and the file size target do not apply, because there are no pixels to compress.

Why an SVG can be resized without losing sharpness

A bitmap stores a fixed grid of pixels, so making it bigger means inventing pixels and making it smaller means throwing some away. An SVG instead stores instructions: draw this curve, fill that shape. A viewer decides how many pixels to use when it draws those instructions, so the same file can look crisp at a tiny size and at a huge one.

Resizing here therefore changes two numbers in the file's header, not the picture itself. Lines, text outlines and shapes are not recomputed, which is why the result is exact and why no quality is lost by going up or down.

How the fit options work for an SVG

When you ask for an exact width and height that has a different shape from the drawing, something has to give. Fit inside shows the whole drawing, centred, and leaves the spare space unpainted. Fill and crop scales the drawing until it covers the whole area and lets the overflow fall outside the visible frame. Stretch squeezes the drawing to the new shape and can distort it.

These three choices map to the standard meet, slice and none settings of preserveAspectRatio. Percent and Max size keep the original proportions, so they never need any of them. Max size follows the same rule as for other types and only shrinks; to make an SVG larger, use Percent or Exact size.

What the resizer leaves alone

Only the outer size is edited. Fonts used by text in the file are not embedded, and pictures the SVG links to from elsewhere are not fetched or included, so they behave exactly as they did before. Any scripts inside the SVG are neither run nor removed; they stay in the file as they were. If you do not trust where a file came from, do not publish it just because it was resized.

Privacy: your files stay on your device

  • The tool decodes, resizes and encodes your pictures with your browser. The files are never sent to a server.

Frequently asked questions

Does the SVG turn into a PNG?

No. It stays an SVG with a new declared width and height. To get a bitmap, use the Image Converter, which can save an SVG as PNG or JPG.

Will the lines get blurry if I make it larger?

No. An SVG is a set of shapes drawn fresh at whatever size is used, so lines and curves stay sharp when enlarged.

Why is the file size almost unchanged?

An SVG is text, and resizing changes only a couple of numbers in it. For a lighter file, a bitmap with a size target is better.

My SVG had no width or height. What now?

The size is taken from its viewBox. The new width and height are written into the file and the viewBox is kept so the drawing scales with them.

Why does it look the same size on my web page?

The page may set its own CSS size for the image, which overrides the attributes in the file. Check the stylesheet or the element's size settings.

Related tools