Friday, November 6, 2026 · Asia/KarachiFree tools · No signup · Runs in your browser

HTML Formatter

An HTML formatter on this page puts tags on their own lines and indents each nested level by two spaces. It is the opposite of a minifier: the goal is to read a fragment, not to make it smaller.

New

The markup is not opened, not executed, and not repaired. A missing closer stays missing. You get a readable copy of the string you pasted.

How to use

  1. Paste a fragment or a short document.
  2. Press Format and read the indented lines.
  3. Copy the block under the line count. Reset restores a one-item list.

Formula / how it works

What the indent means. The formatter walks the string and splits it into tags, comments and the text between them. A start tag increases the indent for what follows. An end tag decreases it before that line is written. Void tags such as br, img, input, meta and link do not increase the indent, and neither does a tag that already ends in a slash. Text between tags gets a line of its own at the current indent, which is why the word Hi sits on a line between li and its closer. The HTML minifier removes whitespace. This page adds it. The HTML viewer draws the markup in a sandboxed frame. Formatting does not draw anything.

What it will not fix. If a closer is missing, the indent stays deeper for the rest of the fragment and the last line still says the tool does not repair that. If tags are in the wrong order, they are indented in the order they appear, not in a corrected tree. Comments are kept whole, including the comment markers, and they do not change the indent. A script element is text to this formatter. It is not run. Do not paste a page here in order to test its behaviour. Paste it to see the nesting.

Line count. The count is the number of indented lines, including the text nodes that were split out. A minified list of one item becomes five lines: the ul, the li, the text, the closer for li, and the closer for ul. Two paragraphs become six lines. The count is a quick check that the split happened, not a count of elements.

Limits. Twenty thousand characters. Two spaces per level, not a tab, and not a setting. Attributes stay on the same line as their tag, so a tag with a long attribute is not wrapped. Entities such as amp are left as you typed them. The HTML encoder is the tool that turns brackets into entities. This one assumes you already have tags and want to see them.

When the result looks worse. A fragment that was already nicely indented gets its existing line breaks trimmed and rebuilt. You may lose a blank line you had put between sections. That is the cost of one mechanical rule. If you needed the blank line, put it back. The formatter’s job is a consistent indent, not your house style.

Worked examples

A one-item list

Inputs: HTML: <ul><li>Hi</li></ul>

Paste <ul><li>Hi</li></ul> and press Format. The word Hi is on its own indented line.

Result: Indented HTML Lines: 5 <ul> <li> Hi </li> </ul> Tags are indented by nesting. This does not run the markup, and it does not repair a missing closer.

Two paragraphs

Inputs: HTML: <p>One</p><p>Two</p>

Paste <p>One</p><p>Two</p> and press Format. Each paragraph is a start tag, a text line and an end tag.

Result: Indented HTML Lines: 6 <p> One </p> <p> Two </p> Tags are indented by nesting. This does not run the markup, and it does not repair a missing closer.

Use cases

  • Reading a fragment that arrived as one line.
  • Checking which tag opened the indent you are looking at.
  • Preparing a snippet to paste into a review.
  • Seeing that a void tag did not push the next line deeper.

Tips & limitations

  • Do not treat a tidy indent as proof the HTML is valid.
  • Use the viewer when you need to see the rendered fragment.
  • Use the minifier when you need fewer bytes.
  • Script inside the paste is not executed.

FAQ

Does formatting run the HTML?

No. Tags are split and indented as text. Scripts in the paste do not run.

Will a missing closer be inserted?

No. The indent stays deep and the note at the end says the closer was not repaired.

Why is the text on its own line?

Text between tags is a token of its own, printed at the indent of the tag that contains it.

Does img increase the indent?

No. img, br, input, meta, link and the other void tags do not push the next line in.

Can I choose tabs or four spaces?

No. The indent is two spaces so the result is stable and easy to compare.

Is the markup uploaded?

No. The split runs in the browser.

Runs entirely in your browser; nothing is uploaded. Check the output before you rely on it in production code, data or security decisions.