HTML Formatter / Beautifier
Format & beautify HTML
What Is This Tool?
The HTML Formatter re-indents raw or minified HTML markup so nested elements are easy to read, and can also minify HTML down for production use. It uses a tag-aware indenter that tracks nesting depth, self-closing "void" elements, and preserves the exact contents of <pre>, <script> and <style> blocks. Everything runs locally in your browser.
How to Use
Paste your HTML into the input box.
Click Format to indent it, or Minify to compress it.
Review the output panel.
Copy the result or download it as an .html file.
Features
- 2-space indented formatting
- One-click minification
- Correctly handles void elements like <br> and <img>
- Preserves <pre>, <script> and <style> contents verbatim
- Copy to clipboard or download as a file
- 100% client-side — nothing leaves your browser
Examples
Before (unindented):
<div class="card"><p>Hello <a href="/">world</a></p><ul><li>One</li><li>Two</li></ul></div>
After (formatted):
<div class="card">
<p>
Hello
<a href="/">
world
</a>
</p>
<ul>
<li>
One
</li>
<li>
Two
</li>
</ul>
</div>
Common Use Cases
- Cleaning up minified HTML pulled from "view source"
- Reviewing template output during development
- Minifying static HTML before deploying it
- Preparing readable HTML snippets for documentation
Frequently Asked Questions
Is my HTML uploaded anywhere?
No. Formatting and minifying happen entirely in your browser using JavaScript. Nothing is sent to a server.
Does this fully parse HTML like a browser?
No. This is a best-effort, regex/tokenizer-based formatter, not a full HTML5 parser. It handles standard, well-formed markup well but may not reproduce every browser error-recovery edge case of the HTML spec.
Does it reformat content inside <script> or <style>?
No. Content inside <pre>, <script> and <style> tags is preserved verbatim and never re-indented, since re-indenting could change how that content is interpreted.
What does Minify do?
Minify collapses whitespace between tags to shrink file size, while leaving the inside of <pre>, <script> and <style> blocks untouched.
Will formatting change how the page renders?
It shouldn't for standard markup, but adding whitespace around inline elements can occasionally affect spacing in the rendered page. Always preview your formatted HTML before publishing.
Can I download the result?
Yes, click Download to save the current output as a data.html file.