HTML Formatter
Pretty-print minified or messy HTML with configurable indent and optional attribute wrapping.
What is HTML Formatter?
An HTML beautifier. It parses the document with a standards-aware tokenizer, puts every block element on its own line, and leaves inline elements and their text together so the result reads the way the page renders.
How it works
The source is tokenized into tags, comments, text and raw-text blocks. Block elements open a new line and increase the indent, inline elements continue the current line, and the contents of <pre>, <textarea> and <style> are copied verbatim. A structural pass also reports unclosed tags and implicit closes it had to infer, so you know when the input was ambiguous.
- Paste the source. Drop in code, a stylesheet, a query or a selector list. Everything is read locally — the page never uploads what you paste.
- Choose the options. Indent width, quote style, keyword case or target browsers. The result updates as you change them, so you can see the effect immediately.
- Copy or download. Copy the result to the clipboard or download it as a file. Reset clears the form and returns every option to its default.
Examples
A single-line template from a build tool
A 1,200-character line becomes a readable tree with one element per line, and the inline <strong> and <a> markup stays on the line it belongs to.
An email template with long attributes
Wrap attributes past 80 characters and every attribute of a long <a href style class> tag gets its own indented line.
Common mistakes
Expecting a formatter to fix invalid code
Formatting is whitespace and quoting. A missing brace, an unclosed tag or an unquoted variable survives the round trip and is reported instead — check the findings list.
Minifying without running the tests afterwards
Even a safe, non-mangling minifier can expose an existing automatic-semicolon-insertion bug. The JavaScript Minifier keeps the newlines that matter, but re-run your tests before shipping.
Treating a rewritten query as verified
The SQL Dialect Converter translates the syntax it can prove; data types, casts and function differences are listed for review, not guessed. Run the converted query against a real database.
Renaming or reformatting generated files
Regenerating a formatter's output is a no-op only if the formatter is the same one that produced it. Keep generated code out of the round trip and format the source it came from.
Frequently asked questions
Does it reformat the contents of <pre> blocks?
No. Whitespace inside <pre>, <textarea> and <style> is significant, so those regions are copied exactly. That is also why the formatter is safe to run on documentation pages.
Why did it tell me a tag was closed implicitly?
HTML allows some end tags to be omitted — <li> inside a list, <td> inside a row, and every block element inside <p>. The parser applies those rules the way a browser does and tells you where it had to, so a genuine mistake does not hide among the legal omissions.
Is the output still valid HTML?
Formatting only changes whitespace between tags, so the DOM is the same. The one exception is whitespace between inline elements, which is preserved on purpose — removing it would change the rendering.