SVG Inspector: find problems in SVG code
Paste or open an SVG to see its structure, colors and resources, plus a list of problems you can click to jump to the exact line.
Drop an SVG file here
Up to 5 MB. Opened only in your browser.
Your SVG is processed in this browser tab. It is never uploaded.
How it works
- Open a file or paste code. The source appears on the left.
- Read the Problems tab and click a result to jump to its line.
- Fix the source in place. The analysis updates as you type.
Common uses
- Finding out why an SVG renders blank or at the wrong size.
- Fixing duplicate IDs before putting several SVGs on one page.
- Listing the colors and fonts a graphic depends on.
What it does
- Detects invalid XML, a missing viewBox, duplicate IDs and broken references.
- Flags scripts, event handlers and external references.
- Checks for a title and role so screen readers can name the graphic.
- Lists colors, gradients, images, fonts, IDs and classes with their usage.
Good to know
The Inspector reads the code; it doesn't draw it. Colors are found in attributes, style attributes and style elements by simple scanning, not a full CSS cascade, and the accessibility checks are basics, not a full audit.
Frequently asked questions
- What counts as a problem?
- Errors break the file or are unsafe, warnings may cause wrong results, and notes are worth knowing about. Each item says which it is.
- Why do duplicate IDs matter?
- When several SVGs share a page, a repeated ID can make gradients, masks and references point at the wrong shape.
- Is the gzip size real?
- Yes. Your browser compresses the code and reports the real byte count. It is shown only if your browser supports it.
- Is my file uploaded?
- No. The analysis runs in your browser tab.
Related tools
- Ready to change it? Edit it in the SVG Editor.
- Just want to look at a file? Open it in the SVG Viewer.
- See every tool in SVG Studio.