HTML Formatter and Minifier Online
This free HTML formatter beautifies and minifies HTML markup instantly in your browser. Switch to Beautify to expand cramped or minified HTML into a cleanly indented tree with one element per line, or switch to Minify to strip the insignificant whitespace that bloats a page. Paste your markup, choose your options, and copy or download the result — nothing is ever uploaded, so it is safe to use with private templates and internal pages.
HTML (HyperText Markup Language) is the markup language of the web: a tree of nested elements written as tags, each with optional attributes and content. Because browsers are extremely lenient about whitespace and formatting, real-world HTML arrives every shape imaginable — minified from a build tool, serialized by a CMS, or hand-edited into a single tangled line. Beautifying reveals the document structure so you can read and edit it; minifying removes the whitespace a browser ignores so the file downloads faster.
How to use HTML Formatter
- Paste your HTML into the Input box — a full page, a fragment, or minified production markup all work.
- Choose a mode: Beautify to pretty-print with indentation, or Minify to collapse whitespace.
- For Beautify, pick an indent size (2 spaces, 4 spaces, or tabs), set a wrap line length (or No wrap), and toggle Preserve newlines to keep or discard existing blank lines.
- For Minify, toggle Remove comments to strip ordinary comments (conditional and important comments are always kept).
- The output updates automatically as you type, paste, or change an option.
- Copy the result or download it as an .html file.
Beautify vs minify
The two modes are inverses. Beautifying (also called pretty-printing) adds consistent indentation and line breaks so the nesting of your elements is obvious at a glance — ideal for reading a page you did not write, debugging a layout, or reviewing markup in a pull request. Minifying removes the spaces, tabs, and newlines that sit between tags and that the browser renders as nothing, producing a smaller file that downloads and parses faster in production.
<ul><li>One</li><li>Two</li></ul> becomes, beautified: <ul> <li>One</li> <li>Two</li> </ul>
What minification preserves
Not all whitespace in HTML is insignificant. The contents of <pre> and <textarea> are whitespace-sensitive — the browser renders their spaces and newlines exactly — and the contents of <script> and <style> are code, not markup. This tool lifts those four elements out before collapsing whitespace and splices them back untouched, so minifying never corrupts a code block, a preformatted listing, or an inline stylesheet. Comments are removed by default when you minify, except conditional comments (<!--[if IE]>) and important comments (<!--! ... -->), which are always preserved.
Beautify options
- Indent: choose 2 spaces, 4 spaces, or tabs for each nesting level. Two spaces is the most common web convention.
- Wrap line length: wrap long lines at 80, 100, or 120 characters, or choose No wrap to keep each element on a single line regardless of length.
- Preserve newlines: when enabled, existing blank lines that separate sections of your markup are kept (up to two in a row); when disabled, they are collapsed for a denser layout.
Related terminology
- Beautify / pretty-print
- Reformatting HTML with indentation and line breaks so the element tree is easy to read; the opposite of minification.
- Minify
- Removing whitespace and (optionally) comments that the browser ignores, to shrink a file for faster delivery — without changing what the page renders.
- Element
- A unit of HTML structure delimited by an opening and closing tag, such as <li>…</li>, optionally holding attributes, text, and child elements.
- Preformatted content
- Text inside <pre> or <textarea>, where whitespace is significant and rendered literally, so it must survive minification unchanged.
- Conditional comment
- A special HTML comment (<!--[if IE]>…<![endif]-->) historically read by legacy Internet Explorer; preserved during minification because it can affect rendering.
Frequently asked questions
- How do I beautify or unminify HTML online?
- Paste your HTML into the input box and select Beautify. The tool re-indents the markup with one element per line and nested children indented, using your chosen indent size. Copy or download the readable result. It is the fastest way to make minified production HTML editable again.
- Does minifying HTML change how the page looks?
- Almost never. Minification removes whitespace and comments the browser ignores, and preserves whitespace-sensitive content in <pre> and <textarea> and code in <script> and <style> exactly. The one thing to watch is that collapsing whitespace between two adjacent inline elements (for example a space between <b> and <i>) removes that space, so review any layout that relies on inline-element spacing.
- Will minifying break my <pre>, <script>, or <style> blocks?
- No. Those four elements are protected: the tool lifts them out before collapsing whitespace and restores them byte-for-byte, so preformatted text, JavaScript, and inline CSS are never altered.
- Are HTML comments removed when I minify?
- Ordinary comments are removed by default when you minify (you can turn this off with the Remove comments toggle). Conditional comments such as <!--[if IE]> and important comments written as <!--! ... --> are always kept, because they can affect how a page is delivered or rendered.
- Can I choose tabs instead of spaces for indentation?
- Yes. In Beautify mode the Indent option lets you pick 2 spaces, 4 spaces, or tabs, and you can also set a line-wrap length or disable wrapping entirely.
- Is my HTML uploaded to a server?
- No. All formatting and minification run entirely in your browser with client-side JavaScript, so your markup is never uploaded, stored, or transmitted — safe for internal templates and proprietary pages.