HTML Formatter
Beautify and pretty-print HTML with clean indentation, or minify it. Runs in your browser; nothing is uploaded.
An HTML formatter re-prints HTML with consistent indentation so the structure of a page or fragment is easy to read, or strips the whitespace between tags to minify it for production. It is handy for tidying markup copied from a page source, cleaning up tool-generated HTML with no line breaks, or shrinking a template before deploy. Paste your HTML and press Beautify to indent it or Minify to compact it — the contents of pre, textarea, script and style are left untouched so the rendered result stays the same. Everything runs locally, so nothing is uploaded. To read Markdown as HTML instead, try the Markdown Preview.
Frequently Asked Questions
What does an HTML formatter do?
An HTML formatter re-prints HTML with consistent indentation so the nesting of elements is easy to read. Each nested element is placed on its own line and indented one level deeper than its parent, which makes the structure of a page or fragment obvious at a glance. It is useful for tidying markup that arrived minified, copied from a page source, or generated by a tool with no line breaks. The formatter can also go the other way and minify HTML by removing the whitespace between tags to shrink the file for production.
Does formatting change how my page renders?
For the vast majority of markup, no — indentation only adds whitespace between block-level tags, which browsers collapse when rendering. There is one thing to watch: whitespace is significant inside certain elements. Text in a pre or textarea, and spacing between inline elements like span or a, can be affected by re-indenting. This tool leaves the contents of pre, textarea, script and style untouched and focuses on indenting the element structure, which keeps the rendered result the same for normal page markup while making the source readable.
Is my HTML private or uploaded anywhere?
Yes — the HTML you paste stays on your device. The formatter runs entirely in your browser using built-in JavaScript, so nothing is sent to a server, logged, or stored. There is no account and no sign-up, which makes it safe for internal templates, email HTML, or markup you would rather not paste into a third-party website. Because everything runs client-side, the tool also keeps working offline once the page has loaded.
What is the difference between beautify and minify?
Beautify expands HTML with line breaks and indentation so a human can read and edit it easily — it is what you want while developing or reviewing markup. Minify does the opposite: it removes the whitespace between tags and collapses runs of spaces so the file is as small as possible, which is what you serve in production to speed up page loads. The two are reversible in the sense that beautifying a minified file and minifying a beautified file both get you back to clean markup — only the whitespace differs, never the content.