HTML Formatter Online Free
Paste messy HTML and get it back clean, indented, and readable in seconds. Beautify or minify, control indent size, and strip comments. Runs entirely in your browser.
A character-walking HTML beautifier and minifier, not a regex hack
Most quick HTML formatters run a handful of find and replace patterns over your markup and hope for the best. This one walks the string one character at a time, tracks a nesting depth counter, and classifies every tag it meets before deciding how to indent it. That distinction matters the moment your markup has a script block full of braces, a self closing image tag, or an inline span sitting next to plain text.
Everything happens in your browser. The tool never sends your markup to a server, there is no fetch call anywhere in the source, and nothing you paste is stored once you close or clear the tab.
How the beautifier reads your markup
The formatter keeps three lookup tables in memory: void tags that never close (img, br, input, hr and friends), inline tags that should not force a new indent level (span, a, strong, code, label), and raw tags whose contents are copied through untouched rather than reparsed (script, style, pre). Every tag it finds gets checked against these tables before a decision is made.
The Math.max(0, depth - 1) guard exists because malformed HTML with an extra closing tag would otherwise push the depth counter negative and throw off every line after it. Clamping at zero keeps the output readable even when the source markup is not perfectly balanced.
Indent width and attribute wrapping
You can pick two spaces, four spaces, or a real tab character for indentation, each applied by repeating the chosen indent string once per depth level. Turning on one attribute per-line rewrites any tag with more than one attribute so each attribute sits on its own line inside the opening bracket, which is the format most diff tools and code reviewers prefer for tags with many attributes.
| Option | What it does |
|---|---|
| Strip comments | Removes everything matching <!--...--> with a single non-greedy regex before formatting begins |
| One attribute per line | Splits a tag’s attribute list and re-indents each attribute one level deeper than the tag itself |
| Collapse blank lines | Drops any output line that trims down to an empty string |
| Indent width | Two spaces, four spaces, or a tab character, applied uniformly at every depth |
What gets counted in the stats bar
Tag count
Counted with a single regex match against every substring starting with a letter after an opening angle bracket, so closing tags and comments are excluded from the total.
Byte size
Computed with new Blob([text]).size, which reflects the actual UTF-8 byte count rather than the JavaScript string length, so multi-byte characters are represented accurately.
One quirk worth knowing: the tool treats code as both an inline tag and a raw tag depending on context. Standalone inline code like <code>x++</code> is left on its line without adding depth, while a <pre><code> block is treated as raw content and its interior lines are preserved exactly, including existing whitespace, which is the correct behavior for a code sample.
Related specifications and tools
- WHATWG HTML Living Standard, void elements defines the exact list of tags that never take a closing tag.
- MDN, inline elements covers the layout distinction this tool mirrors in its formatting rules.
- js-beautify is the long-standing reference implementation for configurable HTML, CSS, and JS beautification if you need more format knobs than this tool exposes.
- html-minifier is the tool to reach for when you need aggressive, production-grade minification beyond whitespace collapsing.
- MDN, Blob.size explains why byte size and character length are not the same number.
When you reach for a formatter
Cleaning up markup copied out of a CMS export or an email builder, reformatting minified vendor HTML before you debug it, checking how many tags a component actually renders, standardizing indentation before a pull request, and shrinking a static HTML page a few kilobytes before deployment when a full build pipeline is not worth setting up.
FAQ: HTML Formatter Online Free
Yes. No account, no subscription, and no usage limits. The HTML formatter is free permanently for anyone.
No. All formatting runs inside your browser using JavaScript. Your HTML never leaves your device, making it safe for proprietary or sensitive code.
Beautify adds indentation and line breaks so humans can read the code easily. Minify removes all whitespace and comments to make the file as small as possible for fast page loads in production.
Yes. Paste any amount of HTML, from a single tag to a complete page with DOCTYPE, head, and body. The formatter handles the full document structure.
When enabled, each HTML attribute is placed on its own line with extra indentation. This is useful for reviewing complex elements with many attributes, such as forms, images, or custom data attributes.
The tool formats whatever you provide without enforcing strict validation. It handles malformed markup gracefully and will still produce readable output even for imperfect HTML.
Enable the Strip comments checkbox in the options bar before clicking Beautify or Minify. All HTML comments will be removed from the output.
From the blog
Deep dives on the things these tools touch
Minification, UUID collisions, diffing API responses, and the other questions that come up around this toolset.