Format HTML with consistent indentation and inspect a restricted preview. Make page markup easier to read while keeping code separate from rendering.
How to use
Paste up to 200,000 characters of HTML. Generate the formatted output and inspect the preview. Copy the source when you need editable markup.
Example
A compressed list with ul and li tags becomes an indented block that makes each list item easier to locate.
FAQ
Why does the preview differ from my site?
Scripts and external resources are blocked, and some markup is removed for preview safety. It is not a full browser test of your page.
Related tools
A practical task
Use formatting to inspect structure before editing a template. Indented child elements make a misplaced closing tag easier to spot. Review any parser error in the surrounding context, since the cause can occur earlier than the reported position.
Another useful question
Can I trust the preview as a screenshot of production?
No. The preview deliberately restricts active content and external resources. Test the final template in its own application with the real styles and assets.
Details for interpreting the result
| Detail | Explanation |
|---|---|
| HTML and plain text | HTML tags describe structure. Plain text displays characters without interpreting them as tags. Decide which result you need before removing markup, escaping brackets, or pasting output into an editor. |
| Formatting and behavior | A formatter changes presentation of source code. It does not prove that a program calculates the right value or that a page looks correct. Keep behavior checks separate from indentation and spacing checks. |
| HTML character references | Character references such as & describe a character inside HTML. A reference can be escaped again when nested in another source. Decoding one layer is different from decoding every layer of a value. |
| Escaping and sanitizing | Escaping represents special characters literally. Sanitizing removes or changes unsafe markup according to rules. Neither operation should be replaced by assuming that unknown input contains harmless display text. |
| Preview boundaries | A restricted preview can block scripts, external images, fonts, and other resources. That keeps the preview separate from active page behavior, but it also means it is not a faithful copy of every production layout. |
| Readable and compact source | Minification produces a compact delivery copy. Keep the readable source for maintenance and rebuilding. Editing only a compressed copy makes reviews harder and loses the useful context removed with comments. |