Overview
Paste XML and see it rendered as an actual element hierarchy - tag names, attributes (including namespaced ones), text content, and repeated sibling elements - built by walking the tree the browser’s native DOMParser produces. This is for exploring structure rather than reformatting source text: instead of a reindented string, you get a real tree you can visually scan the way you would in a code editor’s outline view. Every piece of text is rendered as a React element, never as raw injected HTML. Runs entirely client-side.
Best for: Scanning the structure of an unfamiliar XML payload before writing code against it
How to use this tool
- Paste your XML. Any well-formed document - a SOAP payload, config file, or data export.
- DOMParser builds the tree. The browser’s native XML parser checks well-formedness and produces a real DOM.
- The tree is walked and rendered. Elements, attributes, and text nodes are rendered recursively as React elements.
- Scan the structure. Read tag names, attribute values, and nesting directly, without mentally parsing indentation.
Why use this tool
Real hierarchy, not reformatted text
Renders the actual parsed element/attribute/text tree, not just re-indented markup.
Namespaced attributes shown as-is
Attribute names are shown exactly as parsed, including namespace prefixes.
Safe rendering
Text and attribute values are rendered as React text, never via dangerouslySetInnerHTML.
Client-side only
Nothing you paste is uploaded anywhere.
Frequently asked questions
The XML Formatter’s output is still XML text - just re-indented. This tool instead renders the parsed hierarchy directly as a browsable tree of elements, attributes, and text, closer to an outline view than reformatted source.
Yes - for running an XPath expression against the same kind of document and seeing the matched nodes, use the XPath Tester, which shares the same DOMParser-based parsing this tool uses.