SVG viewBox Editor
Edit SVG viewBox, width, and height values online. Adjust the coordinate system, remove fixed dimensions, preview the result, and export locally.
1 Source SVG
Read existing values2 Edited SVG
Updated on applyYour file is processed on this device and never uploaded.
How it works
From input to output,
in a few clicks.
Change how an SVG is framed and scaled without recalculating its paths by hand. Read the existing canvas values, edit the four-part viewBox and optional display dimensions, then generate clean SVG markup in your browser.
- Load the current canvasUpload or paste an SVG, then select Read dimensions to populate its width, height, and viewBox fields.
- Edit sizing valuesChange the minimum coordinates and viewBox span, adjust optional dimensions, or choose to remove fixed width and height.
- Apply and exportApply the values to update the markup and image preview, then copy or download the edited SVG.
Good to know
Frequently asked questions
What do the four viewBox numbers mean?
They are the minimum x coordinate, minimum y coordinate, width, and height of the SVG coordinate system. Changing them reframes the artwork without directly rewriting the coordinates inside each shape or path.
Why remove the width and height attributes?
An SVG with a viewBox but no fixed dimensions can more easily fill a responsive container. CSS or the embedding element can then control its rendered size while preserving its aspect ratio.
Does changing the viewBox crop or rescale my paths?
It changes the visible coordinate window, so artwork can appear cropped, revealed, or scaled. The underlying path and shape coordinates remain unchanged; always check the preview before exporting.