HTML Formatter

Features

• Beautify with 2-space, 4-space or tab indentation
• Minify with a before-and-after size comparison
• Preserves whitespace-sensitive elements
• Handles void elements and self-closing tags
• Tag frequency summary

How to use it

1. Paste your HTML into the input box.
2. Choose an indentation style.
3. Press Beautify to format, or Minify to compress.
4. Copy or download the result.

Whitespace in HTML is not always insignificant

HTML collapses runs of whitespace to a single space when rendering, which is why you can indent markup freely. But whitespace is not universally ignorable. Inside <pre>, <textarea> and any element with white-space: pre, every space and newline is significant, reindenting those changes what the user sees. This formatter leaves their contents untouched when the preserve option is on.

There is a subtler case that catches people out with minification. Inline elements are separated by the whitespace between them, so <span>a</span> <span>b</span> renders as “a b” while removing that single space renders “ab”. Aggressive minifiers that strip all inter-tag whitespace can visibly change layouts. This one only collapses runs of whitespace rather than eliminating them entirely, which is the safe default.

Minification savings on HTML are usually modest, often 10% to 20%, and much of that overlaps with what gzip or brotli compression would achieve anyway, since repeated indentation compresses extremely well. If your server has compression enabled, the incremental benefit of minifying HTML is small. It matters far more for CSS and JavaScript, where minification also shortens identifiers.