SVG Tools

SVG Formatter

Organize SVG line breaks and indentation to make its structure easier to read and check.

Your SVG stays in your browser and is never uploaded to a server.

About This Tool

SVG Formatter makes single-line or inconsistently indented SVG easier to read. It checks the XML, then adds line breaks where appropriate while preserving path data, text, and namespaces.

How to Use

  1. Choose an SVG file or paste the source you want to format.
  2. Choose 2 or 4 spaces for each indentation level.
  3. Click Format SVG. If the input is invalid, use the message to check its tags and attributes.
  4. Check the result, then copy it or download formatted.svg.

Features

  • Choose 2- or 4-space indentation, load an example, clear the input, copy, or download.
  • Formatting preserves shapes, gradients, definitions, and text without converting the SVG to pixels.
  • Invalid XML produces no formatted output, so you can fix the input first.

How formatting works

  • Whitespace within text and mixed content can affect appearance. These areas are carefully preserved and may not put every tag on a separate line.
  • Comments, CDATA, namespaces, and path data keep their meaning. Attribute quotes and empty-element notation may be standardized.
  • Formatting does not remove unsafe content. The download may retain scripts or external references from the original; this page always previews a separate filtered copy. Treat files from unknown sources with care.

SVG Safety

Previews use a filtered static copy. Scripts, click events, animations, external images, fonts, and styles do not run or load. External references, embedded web pages, and unsupported content are removed, so the preview may differ from the original. Documents with a DOCTYPE or custom entities are not supported.

SVG files and UTF-8 source are limited to 2 MiB, 20,000 nodes including elements and text, and 96 nesting levels. Simplify files that are too large or complex before trying again.

Privacy

Your SVG stays in your browser and is never uploaded to a server.

Inputs and results are not saved automatically. Download anything you want to keep before clearing the tool or leaving the page, and keep a copy of your original.

FAQ

Will SVG Formatter change the graphic?

Formatting improves readability without deliberately changing paths or gradients. Whitespace that affects text is preserved. Filtering may make the preview differ from the original.

How are SVG and XML related?

SVG uses XML syntax to describe graphics. Tags must match, attribute values must be properly quoted, and the document must have an SVG root element.

Will formatting make the file smaller?

Usually not. Added indentation and line breaks may make it slightly larger. Use SVG Minifier to reduce file size.

How do Formatter and Minifier differ?

Formatter improves readability; Minifier reduces file size. Formatted output preserves the original content, so it may still contain unsafe elements.

Back to the Developer Tools Directory