HTML Formatter & Beautifier

About the HTML Formatter & Beautifier

Paste HTML and get it re-indented with 2 spaces, 4 spaces or tabs so the nesting is easy to read. The markup is parsed as inert data, so scripts in it are not run, and Download saves the result.

Browsers repair HTML while parsing, so the output reflects the document the browser would build, not necessarily the exact characters you typed.

How to use it

1. Paste your HTML into the Raw Input box, or press Sample HTML.
2. Choose 2 Spaces, 4 Spaces or Tab.
3. Review the formatted output, then Copy Output or Download it.

Worked example

Formatted with the 2 Spaces option.

<div><p>Hello <b>world</b></p><ul><li>a</li><li>b</li></ul></div>

<div>
  <p>
    Hello
    <b>world</b>
  </p>
  <ul>
    <li>a</li>
    <li>b</li>
  </ul>
</div>

Common mistakes and gotchas

• Inline elements such as b and a are placed on their own lines, which can add visible spaces if you paste the output back into inline content. Check whitespace-sensitive text.
• Content of pre and textarea elements is whitespace-sensitive; make sure reformatting did not change it.
• Missing end tags and misnested tags are fixed by the parser, so the formatted output can differ structurally from broken input.
• Formatting never executes the page: scripts, event handlers and external resources are not loaded.

Frequently asked questions