Free HTML Minifier
Paste or upload your HTML and compress it instantly in your browser. Removes comments, whitespace, and blank lines. Inline CSS and JS are minified too.
What gets minified
HTML minification targets the characters browsers skip anyway: whitespace between tags, comments, and blank lines. Most of the savings come from indented templates and CMS-generated markup, which tends to be heavily padded with whitespace that has no effect on rendering.
Inline <style> and <script> blocks are minified using full CSS and JavaScript rules. Pre-formatted blocks (<pre>, <textarea>) are left untouched. Quoted attribute values are preserved exactly, so strings like class="a b" keep their internal spacing.
All processing runs locally in your browser. Nothing is uploaded, so it's safe for HTML you can't send to a third-party server.
Before and after
Before: 192 bytes
<div class="card">
<!-- User profile card -->
<h2> Hello, world </h2>
<p>
Welcome to the site.
</p>
<style>
.card { padding: 1rem; }
</style>
</div>After: 99 bytes (48% smaller)
<div class="card"><h2> Hello, world </h2><p> Welcome to the site.</p><style>.card{padding:1rem}</style></div>The comment is gone, whitespace between tags is removed, and the inline CSS is minified. The rendered page looks identical.
How the HTML minifier works
The minifier runs a multi-pass approach. First, it stashes whitespace-sensitive blocks (<pre>, <code>, <textarea>) behind placeholders so their content is never touched.
Then it delegates inline <style> blocks to the CSS minifier (CSSO) and inline <script> blocks to the JavaScript minifier (Terser). Each embedded language gets full, proper minification rather than simple whitespace stripping.
Finally, it removes HTML comments, collapses runs of whitespace, and strips gaps between tags. Quoted attribute values are protected throughout, so strings and URLs inside attributes are never altered.
When to use this vs. a build tool
If you use a build tool like Webpack, Vite, or Gulp, HTML minification can be added as a plugin (html-minifier-terser is the most common). That's the right approach for automated pipelines where every deploy should be minified.
This tool is useful when you have a one-off file, need to check how much minification saves before setting up a pipeline, or are working with HTML that comes from a CMS or email builder and never goes through a build step.
HTML Minifier FAQ
What does the HTML minifier remove?
It removes HTML comments, unnecessary whitespace between tags, redundant newlines, and leading/trailing spaces. Inline <style> and <script> blocks are also minified using CSS and JavaScript rules.
Will minifying HTML break my page layout?
No. Whitespace between block-level elements has no visual effect. Inline elements like <span> can occasionally be affected if you rely on whitespace between them, so review the output if your layout uses inline text nodes.
How much can HTML minification save?
Typical savings range from 15–30%. Pages with lots of comments or indented templates see larger reductions. Combined with gzip/Brotli compression on your server, HTML size can be reduced by 80%+ total.
Should I use a build tool for HTML minification instead?
For automated pipelines, yes. Tools like html-minifier-terser integrate directly into Webpack, Vite, and Gulp. MinifyTools is useful for one-off files, previewing minification output before committing to a build setup, or compressing HTML you can't run through a build pipeline.