HTML Formatter and Minifier - Beautify or Shrink

Tools /
/ Formatters / HTML Formatter

HTML formatter and minifier

What this tool does

Two opposite jobs on the same text. Formatting adds line breaks and indentation so a human can follow the nesting; minifying removes everything a browser does not need. Both here work on the characters you gave, not on a rebuilt document, so what comes out is still your markup.

How to use it

  1. 1 Paste the HTML - a whole page or just a fragment.
  2. 2 Pick your indent, then choose Format or Minify.
  3. 3 Copy the result, or run it through the other button to compare.

Whitespace is not always noise

Between two inline elements a single space is visible text: remove it and "one two" becomes "onetwo". Between block elements the same space means nothing. The minifier here drops indentation but keeps a separating space where one is doing real work.

Why pre and textarea are left alone

Inside these, every space and newline is content the reader will see. Re-indenting a code block would silently change what it displays, and trimming a textarea would change the value a form submits. The same goes for script and style: their contents are another language and are passed through untouched.

It formats, it does not repair

Tools built on the browser parser quietly fix broken markup: they close your tags, drop stray ones and move elements into places the spec demands. That is often not what you want when you are debugging - the bug you are chasing may be exactly the thing that got repaired. This one reformats the text and leaves the mistakes where you can see them.

Minifying HTML is the small win

Stripping whitespace from a page usually saves a few percent, and gzip on the server would have compressed most of it anyway. The real weight is in images, fonts and scripts. Minify HTML because a template generator left the output unreadable, not because you expect the page to get much faster.

HTML formatting - frequently asked questions

Formatting can, in one specific case: adding line breaks between inline elements introduces a space that was not there. If a layout depends on two spans touching, format the surrounding block but leave that line alone. Minifying is designed to avoid the reverse of the same problem.
New
JavaScript Minifier Shrink JavaScript with Terser, the engine build tools use. It parses your code instead of guessing at it, so behaviour survives. Nothing is uploaded.
Popular Today
XML Formatter Indent messy XML so you can read it, or strip it down so it ships smaller. Handles RSS, CDATA and namespaces, and never rewrites your document.

Related Dev Tools

JSON Formatter Format, minify and validate JSON in your browser. Broken input is pinpointed by line and column, and a collapsible tree shows the structure.
CSS Minifier Compress CSS by stripping comments and whitespace, or expand it back with clean indentation. Keeps calc() spacing, strings and license comments intact.
XML Formatter Indent messy XML so you can read it, or strip it down so it ships smaller. Handles RSS, CDATA and namespaces, and never rewrites your document.
SQL Formatter Break a long query onto readable lines, or squeeze it back onto one. Keeps your keyword casing, your quoted names and your strings exactly as written.
JavaScript Minifier Shrink JavaScript with Terser, the engine build tools use. It parses your code instead of guessing at it, so behaviour survives. Nothing is uploaded.

Other Tools You May Like

Word to PDF Convert Word to PDF for free: upload a DOC, DOCX, ODT or RTF file and download a properly formatted PDF in seconds - no registration or watermark.
PDF to Word Convert PDF to Word for free: upload a PDF and download an editable DOCX in seconds - no registration, no watermark and nothing to install.
Word Counter Free word counter: paste any text to count words, characters, sentences and paragraphs, and see the estimated reading time - nothing leaves your browser.
Character Counter Free character counter: count characters with and without spaces, plus words and lines, and check SEO limits for titles and meta descriptions.
Keyword Density Checker Free keyword density checker: paste text or a URL to see how often each word and phrase appears, with percentages for one, two and three-word terms.