SVG Optimizer

Reduce redundant SVG markup locally, with a preview and byte-size comparison.

Images & Graphics
Preparing your workspace…

Input

Preparing your workspace…

Output
Your result will appear here.

How to use

  1. Paste SVG source or open a UTF-8 SVG file.
  2. Select Optimize SVG and compare the preview and byte sizes.
  3. Download the SVG, or expand Result to inspect and copy its markup.

Optimizing vector markup

An SVG can contain editor metadata and verbose drawing instructions in addition to the shapes that are displayed. Optimization rewrites that markup to reduce unnecessary bytes.

This tool uses SVGO with three-decimal coordinate precision and preserves viewBox and IDs. Keep the source available so you can compare the optimized result in its final context.

What may change

Optimization can remove metadata and simplify drawing instructions. Three-decimal coordinate precision can change geometry slightly, especially in very small or heavily scaled artwork.

The viewBox supports responsive sizing, while IDs may be referenced by shapes, styles or surrounding code. This configuration retains them rather than shortening or removing them.

Example
Input
<svg viewBox="0 0 10 10"><metadata>demo</metadata><path d="M0 0 L10 10"/></svg>
Result
<svg viewBox="0 0 10 10"><path d="m0 0 10 10"/></svg>

Abbreviated markup comparison highlighting metadata removal and a compact path. Downloaded output also includes the SVG namespace.

Preview and embedding

The preview loads the result as an isolated image instead of inserting it as live page markup. Its behavior can differ from an inline SVG used inside your application.

Optimization is not sanitization. Review untrusted SVG before embedding it inline, and test any styling, references or behavior that depends on the surrounding document.

Inspecting and saving output

Download saves optimized.svg. Expand Result for the generated source and its Copy button; a smaller byte count alone does not establish visual equivalence.

Processing limits

Still PNG, JPEG and WebP: 20 MiB, 24 megapixels and 8,192 pixels per side. Base64: 2 MiB. SVG: 1 MiB. File inspection: 1 GiB with only the first 256 bytes read. Browser codec support varies. No files are uploaded.

?

Frequently asked questions

Is optimized SVG safe to embed inline?

Optimization does not sanitize the source. Review untrusted elements, attributes, URLs and styles before using SVG inline in an application.

Are viewBox and IDs preserved?

Yes, this configuration preserves them. Other markup may still be rewritten, so test references and styling in the destination document.

Can optimization change the image?

Coordinate rounding and structural rewrites can affect rendering. Compare the preview and test the file where it will be used.

Why does the isolated preview differ from my page?

An image preview does not share the surrounding page CSS or inline-SVG behavior. External context and document-level references can matter.

Where is the Copy button?

After optimization, expand Result beneath the preview. It contains the generated SVG source and a Copy button; Download SVG is available above the preview.

Find your next tool

Language

Switch language? Your current work will be cleared. Copy or download it first.