HTML Formatter
Pretty-print or minify HTML with safe handling of script, style, and pre.
Written by Golam Rabbani, Founder & Lead Engineer
How to use this html formatter
- Paste your HTML markup into the input box.
- Choose an indent size — 2 spaces, 4 spaces, or tab.
- Pick Pretty print to indent the document or Minify to shrink it for production.
- Press Format to tokenise and rewrite the HTML.
- Copy the result to your clipboard, or reset to clear the form.
About this html formatter
The HTML formatter tokenises your markup into open tags, close tags, void elements, comments, and text nodes, then reprints it with consistent indentation. Void tags like <br>, <img>, and <input> are emitted without a closing partner, the contents of <pre>, <script>, <style>, and <textarea> are kept verbatim, and text runs outside those raw containers are collapsed to single spaces so the structure becomes obvious at a glance.
Because the tool runs in your browser there is no upload step — useful when the markup contains tokens, secrets in script blocks, or content you would prefer not to send to a third party. Minify mode strips every comment and every optional whitespace character between tags so you can paste the result straight into a production template, an email, or a JSON string.
For example, the input <div><p>Hello <b>world</b></p></div> at 2-space indent becomes: <div> <p> Hello <b>world</b> </p> </div>
Switching to Minify produces <div><p>Hello <b>world</b></p></div> with all the surrounding whitespace removed.
FAQ
- Does the formatter validate my HTML?
- It performs structural checks — open tags must be closed and brackets must balance. It does not validate against the full HTML5 specification or warn about deprecated attributes; it focuses on producing clean, predictable output.
- Will it break the contents of <script>, <style>, or <pre>?
- No. Those raw-text containers are detected and their contents are passed through unchanged so JavaScript, CSS, and preformatted text survive the round trip.
- What does Minify do that Pretty print does not?
- Minify removes HTML comments and collapses all whitespace between tags. Pretty print keeps comments, adds line breaks between block-level elements, and indents children.
- Is my markup uploaded anywhere?
- No. The HTML formatter is fully client-side; nothing is sent to a server.
- Why are some tags on the same line as their text?
- When an element contains only a short text run the formatter keeps it inline to avoid noise. Block elements with multiple children are always broken onto separate lines.
- Can I use it on partial fragments instead of a full document?
- Yes. The formatter does not require an <html> or <body> root, so component snippets, email bodies, and embedded blocks format cleanly.