Input
Output
How this one works
Beautify puts each block element on its own line and indents children inside their parents, so the structure of a page is visible at a glance. Inline elements such as links and <strong> stay in the flow of their text.
Minify removes comments and the whitespace the browser would not draw: line breaks and indentation around block elements such as <div> and <li>. A space between two inline elements, such as two links in a row, is kept as one space, because removing it would join the words. Attribute values and the contents of <pre>, <textarea>, <script> and <style> are left exactly as they are, because whitespace there does matter.
Questions
Will minifying change how my page looks?
It shouldn't. Whitespace next to block elements doesn't render, so it is removed. Runs of whitespace in text become a single space, which is what the browser shows anyway, and a space between two inline elements stays. Attribute values, preformatted blocks, scripts and styles are left untouched.
Does it minify the CSS and JavaScript inside the page too?
No. Inline <style> and <script> contents are preserved as written, so nothing inside them can break. Use the CSS Formatter or JavaScript Formatter to minify those separately.
Will it fix broken HTML?
No. Beautify indents whatever it is given and doesn't check that tags are closed or correctly nested, so a missing </div> shows up as indentation that never steps back out. That is often the quickest way to find it.
Is my HTML uploaded anywhere?
No. Formatting runs as JavaScript in your browser tab. Nothing is sent to a server, and nothing is stored after you close the page.