HTML Formatter | SparkJSON

Input HTML

Output

<!DOCTYPE html>
<html>
  <head>
    <title>
      SparkJSON
    </title>
    <style>
body{margin:0;font-family:sans-serif}</style>
  </head>
  <body>
    <div class="card">
      <h1>
        Hello
      </h1>
      <p>
        Formatted
        <strong>
          HTML
        </strong>
        with
        <pre>
  preserved   whitespace
  in pre blocks  </pre>
        and a script:
      </p>
      <script>

  const x = "<div>this is not a real tag</div>";
  console.log(x);
</script>
    </div>
  </body>
</html>

Content inside <pre>, <script>, and <style> tags is preserved exactly as written — it is never re-indented or treated as markup to format.

Quick answers

What happens if my HTML has an unclosed tag?
The formatter won't crash. It tracks open tags on a stack as it scans, and if a closing tag doesn't match anything open, it's handled tolerantly rather than throwing an error — you'll still get formatted output for the rest of the document.
Will formatting break my inline <script> or <style> code?
No. Everything between a <script> or <style> opening tag and its matching closing tag is treated as opaque content and copied through unchanged — it's never parsed as HTML or re-indented as if it were markup.

About HTML Formatter

Pretty-print or minify HTML markup while correctly preserving the exact content of <pre>, <script>, and <style> tags. Malformed or unclosed tags are handled gracefully instead of crashing the formatter.

This formatter deliberately doesn't hand your markup to the browser's built-in HTML parser. The DOM parser is extremely forgiving — it silently closes unclosed tags, reorders misplaced elements, and 'fixes' things in ways that would hide the actual structure of what you pasted. Instead, this tool tokenizes your HTML linearly and tracks a tag stack itself, so malformed or unclosed tags degrade gracefully instead of being invisibly repaired.

The content of <pre>, <script>, and <style> elements is captured verbatim the moment their opening tag is seen, up to their matching closing tag, and is never re-indented or reformatted — which matters because whitespace inside <pre> is meaningful, and reformatting JavaScript or CSS as if it were markup would corrupt it. Minification follows the same rule: those elements are copied through byte-for-byte while surrounding markup has its whitespace collapsed and comments removed.

Frequently asked questions

What happens if my HTML has an unclosed tag?

The formatter won't crash. It tracks open tags on a stack as it scans, and if a closing tag doesn't match anything open, it's handled tolerantly rather than throwing an error — you'll still get formatted output for the rest of the document.

Will formatting break my inline <script> or <style> code?

No. Everything between a <script> or <style> opening tag and its matching closing tag is treated as opaque content and copied through unchanged — it's never parsed as HTML or re-indented as if it were markup.

Does minify remove HTML comments?

Yes, standard HTML comments () are stripped during minification to save bytes. Content inside <pre>, <script>, and <style> is left completely untouched either way.