HTML formatter & minifier
Format or minify HTML.
FreeRuns in your browserNo signupUpdated 2026-10-29
Content inside pre, textarea, script and style is never reflowed. Conditional comments are always kept.
Output size
613 B
28 lines
Change
+31.5%
from 466 B
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Pricing</title>
<!-- main stylesheet -->
<link rel="stylesheet" href="/site.css">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/pricing" class="active">Pricing</a></li>
</ul>
</nav>
</header>
<main>
<h1>Simple pricing</h1>
<p>Three plans. <strong>No contracts.</strong></p>
<pre>keep this
spacing</pre>
<script>
document.body.classList.add("js");
</script>
</main>
</body>
</html>About this tool
How it works and how to read the result.
Need this done for you?
Website design & development
Company websites designed and built to win trust and enquiries.
See the serviceWhat it does
An HTML formatter takes markup that has been squashed onto a few lines, or pasted from a page builder, and indents it so that the nesting is obvious. The same tool runs in reverse as a minifier, removing line breaks, indentation and optional comments to shrink the file before it goes live. Both modes protect pre, textarea, script and style blocks, since whitespace inside those is meaningful. The size stats show what each operation did to the byte count.
How to use it
- Paste the HTML you want to tidy or shrink. Full documents and fragments are both fine.
- Choose Format or Minify.
- For formatting, pick an indent of two spaces, four spaces or a tab to match your project, and optionally a wrap width.
- For minifying, decide whether to keep comments.
- Copy the output or download it as an .html file.
How to read the result
The sample is a 466-byte page crammed onto seven lines. Formatted with two-space indentation it grows to 613 bytes across 28 lines, a change of +31.5 percent; the extra bytes are indentation, and the gain is that you can now see the header, nav and main sections at a glance. Minified with comments removed, the same page drops to 439 bytes, about 6 percent smaller. The saving is small because the sample was already compact; a hand-indented template saves much more.
In the minified output, notice that the pre block still contains its original spacing and the script is unchanged. Whitespace between tags is gone, so a line such as "
The change percentage is negative when the output is smaller. A positive figure after formatting is expected and harmless, since the file is for reading, not shipping.
Clean, indented markup is part of every website we build. To shrink the stylesheet as well, use the CSS minifier.
Questions
Frequently asked.
Will formatting change how the page looks?
Almost never. Browsers collapse runs of whitespace between most elements, so adding line breaks and indentation has no visible effect. The exceptions are pre, textarea and inline elements separated by a single space, which is why those blocks are left untouched by the formatter.
How much does minifying HTML actually save?
The saving equals the indentation, line breaks and comments in the file, so a deeply indented template shrinks far more than markup already squeezed onto a few lines. Once gzip or Brotli is applied on the server the gap narrows, since compression already handles repeated whitespace well. Minifying CSS, JavaScript and images usually matters more.
Why are my comments still there after minifying?
"Keep comments" is on by default because comments sometimes carry licence notices or markers that templating systems rely on. Untick it to remove them. Conditional comments for old Internet Explorer are always kept, as removing them can change what that browser renders.
Your next move
Like what you see? Tell us about it.
A process that takes too long, a website that undersells you, or an idea ready to take shape. Tell us where you are and we will suggest a useful next step.
India · Working with clients worldwide