HTML formatter
Processed in your browser · nothing is uploaded
Re-indents HTML by nesting depth, leaving the contents of pre, textarea, script and style exactly as it found them.
How to use the html formatter
Those four are protected for a reason: whitespace inside them is significant. Re-indenting a pre block changes what the page displays, and re-indenting a script can break a template literal or a line comment. Void elements; br, img, input, hr and the rest; are handled too, since they have no closing tag and must not increase the indent depth.
Each protected block is set aside whole before any indenting happens, matched from its opening tag to the first close that fits. Which is exactly why the HTML spec makes you write <\/script> inside a JavaScript string: a literal </script> ends the element for every parser that will ever read the page, this one included. If a script block comes back cut short, that string is the reason.
The other place the input can confuse it is an unescaped angle bracket inside an attribute value. The tokeniser splits on <, so title="a < b" is read as the start of a tag. Writing it title="a < b" is what the spec asks for anyway; this is one more argument for doing it.
This is a formatter rather than a linter. It will not close a tag, fix nesting, or notice a duplicated attribute. An unclosed tag shows up as everything after it indented one level too deep, which in practice is a perfectly good way to find it.
Questions
No. Those, with textarea and style, are preserved byte for byte because whitespace in them is significant.
No, it is a formatter not a linter. An unclosed tag shows up as everything after it indented too deeply.
A literal </script> inside a JavaScript string ends the element for every parser. Write it as <\/script> in the string, which the spec requires regardless.
Not reliably: the tokeniser splits on <. Escape it as <, which is what the spec asks for anyway.
Elements with no closing tag — br, img, input, hr, meta, link. They must not increase the indent depth.
Yes, that is the main use.
No, it is processed in the page.