SVGKit
← Browse all toolsSVG Resize / Scale

SVG Resize / Scale

Edit

Resize SVG width and height while preserving the original viewBox coordinate system.

Loading...

Page context

Where SVG Resize / Scale fits

SVG Resize / Scale changes SVG width and height while preserving the original viewBox coordinate system.

Related guides

What changes

The tool updates root width and height attributes. If a viewBox exists, the internal coordinate system is preserved.

viewBox versus display size

viewBox defines the coordinate system; width and height define the on-screen size. Changing the latter rescales the rendered artwork without touching a single path — that is why SVG resizing never loses quality.

Edits land as real SVG attributes select on canvas <rect x="130" y="120" width="100" height="70" fill="currentColor" /> standards-based — renders anywhere
SVG Resize / Scale edits real SVG structure — what you change on the page is what lands in the file.
A selected rectangle with handles flowing into a real SVG rect element, illustrating how SVG Resize / Scale edits land as standards-based attributes.

Retina and responsive sizing

Export at 2x the display size for high-density screens, or drop fixed dimensions entirely and let CSS size the SVG responsively — the artwork stays sharp at any scale.

When to use it

Use it when an SVG needs fixed display dimensions but should keep the same artwork coordinates.

What you can change

SVG Resize / Scale edits real SVG structure — elements, attributes, and values as they exist in the document — so what you change on the page is what lands in the file.

Edits are real SVG

Nothing is converted into a proprietary format along the way. The result remains standards-based markup that renders the same in browsers, editors, and build pipelines.

How to use

  1. Paste SVG. Paste SVG markup with width/height or viewBox.
  2. Resize. Drag the scale slider to update the output dimensions and preview in real time.
  3. Check the preview. Confirm the artwork scales as expected at the new size.
  4. Copy or download. Copy the resized SVG or download it as an SVG file.

Frequently asked questions

Does resizing change the artwork paths?
No. This first version changes root dimensions and preserves viewBox.
What size does it use?
The scale slider starts at 100% of the source width and supports proportional resizing from 10% to 400%.
Can I set custom dimensions?
Use the live scale slider to adjust output width and height proportionally.
Does scaling down lose quality?
No. SVG is resolution-independent; the renderer recomputes the artwork at any size.
Should I resize or edit the viewBox instead?
Resize when the artwork coordinates are correct but the display size is wrong. Edit the viewBox when you want to crop or remap coordinates.
What if my SVG has no width or height?
The tool scales from the viewBox dimensions so the output gets explicit, predictable dimensions.
Can I resize non-uniformly?
The current version scales proportionally to keep the artwork undistorted.
Is SVG Resize / Scale free?
Yes. SVGKit tools are free to use with no account required.