HTML formatter
Beautify or minify HTML with a hand-written tokenizer: block elements get indented while inline elements stay on one line, void elements (br/img/input…) are never given a closing tag, pre/textarea/script/style content is preserved verbatim, attribute quotes are normalized and the indent width is configurable.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Type some HTML above and the result shows up here.
What this tool does
- Expand a minified HTML email, template or scraped fragment back into an indented version so the nesting is obvious.
- Shrink a static page before shipping: collapse whitespace, drop comments and remove unnecessary attribute quotes.
- Spot broken markup in a template you were handed — mismatched attribute quotes or a tag missing its `>` are reported instead of silently passed through.
- Tidy the outer structure while keeping `script` / `style` / `pre` / `textarea` content byte for byte, so embedded code cannot be broken by reflowing.
Example
Input
<div><p>Hello <b>world</b>!</p><p>Second</p></div>
Output
<div> <p>Hello <b>world</b>!</p> <p>Second</p> </div>
Block elements get a line each, inline elements (b, span, a…) stay on one line, and void elements such as br, img and input never receive a closing tag.
Frequently asked questions
Can re-wrapping whitespace change how the page renders?
Not for normal markup: HTML collapses runs of whitespace into a single space, so newlines and indentation between block elements are invisible. Only pre, textarea, script and style are whitespace-sensitive, and their content is preserved verbatim.
Why do br, img and input have no closing tag?
They are void elements in the HTML standard and never take a closing tag — writing `</br>` is invalid. The formatter keeps `<img ...>` as-is and does not add a self-closing slash either.
How are attribute quotes handled?
Pretty mode normalizes everything to double quotes, escaping an inner `"` as `"` and adding quotes to unquoted values such as `type=text`. Minify does the opposite: quotes are dropped whenever the value contains no whitespace, quotes or angle brackets.
Is inline JavaScript or CSS minified too?
No. The content of script, style, pre and textarea is emitted exactly as written, only moved onto its own lines, so strings, regular expressions and newline-sensitive code stay intact.
Can I format a fragment without html/body?
Yes. The input does not have to be a complete document; elements are indented by nesting level, and a closing tag without a matching opening tag (legal in HTML) is passed through instead of raising an error.
Keywords：htmlhtml formatterhtml beautifyhtml minifypretty print htmlhtml 格式化html 美化html 压缩缩进void 元素属性引号代码美化