HTML Minifier
Every byte of HTML a visitor downloads is a byte the browser waits on before it can build the page, and most markup carries slack a build step should clear away, from indentation and comments to whitespace between tags. This minifier removes it in one paste. Because real pages embed styles and scripts, it also shrinks the CSS inside <style> and the JavaScript inside <script>, so the whole document comes out smaller, with the original, minified, and gzip sizes shown side by side so the saving is never a guess. It collapses whitespace where it is safe to, never where it would change rendering, and it all runs locally in your browser.
- Collapses the whitespace and comments between tags, where doing so does not change how the page renders
- Also minifies the embedded CSS in <style> and JavaScript in <script>, not just the markup
- Shows the original, minified, and gzip sizes together, so you judge the result by what a server actually sends
- Runs entirely in your browser, so the markup you paste, including unreleased work, stays on your device
Overview
A minifier is only worth using if you can trust the output and see the gain. This one is built around both: safe compression you can ship, and the numbers that show it was worth doing.
- 01
Markup collapsed safely
The whitespace and line breaks between tags are removed, but content where spacing is significant is left alone. Text inside pre and textarea, and the gaps between inline elements that affect layout, are preserved, so the rendered page is unchanged.
- 02
Embedded CSS and JS minified too
A real page is rarely just markup. The CSS inside every <style> block and the JavaScript inside every <script> block are minified in the same step, so you do not have to run them through separate tools to squeeze out the bytes.
- 03
Comments removed, conditionals kept
HTML comments are stripped by default, since they never reach the rendered page, while conditional comments are preserved because they carry meaning. Keep all comments with one toggle when you need them for debugging.
- 04
A size breakdown you can trust
Original, minified, and gzip sizes update as you type, next to the exact percentage saved. The gzip figure is the one that matches what travels over the wire.
- 05
Options you control
Whitespace is always collapsed, but minifying the embedded CSS and JS, and keeping comments, are each a toggle, so you decide how far the compression goes.
- 06
Copy, download, or upload
Paste from the clipboard, load an .html file from disk, then copy the result or save it as a min.html file. The whole loop takes seconds and never touches a server.
How to use
Go from a readable page to a production-ready, minimal one in a few steps, with the saving in front of you the whole time.
- 01
Paste your HTML into the input panel, or use Upload to load an .html file straight from disk.
- 02
Choose your options. Leave Minify CSS and Minify JS on to shrink the embedded code too, and keep comments only if you need them.
- 03
Read the breakdown beside the output to confirm the gain, with the original, minified, and gzip sizes and the percentage saved.
- 04
Copy the minified HTML or download it as a min.html file, then wire it into the page or build step that serves your production markup.
Details
The details that make the output safe to ship and quick to trust.
- Built on html-minifier-terser, which parses the markup and minifies embedded CSS and JS with mature optimizers rather than by blind text substitution.
- The gzip size is measured with the compression built into your browser, so the figure reflects what a real server would send.
- Minification runs as you type and as you change options, with no button to press before the result updates.
- A parse error is shown in place with its message, instead of quietly producing broken or empty output.
- Nothing is uploaded or logged. The HTML you paste, including unreleased work, stays in your browser and is gone when you close the tab.
Use cases
Where shaving HTML down to its essentials pays off.
-
Shipping a faster page
Smaller markup reaches the browser sooner and unblocks parsing, which helps First Contentful Paint and the Core Web Vitals that search engines weigh.
-
A build step without a bundler
On a static site, a landing page, or an email template where you are not running a bundler, paste the HTML here for the same compression a pipeline would give you.
-
Inlining a critical-path document
When you ship a single self-contained HTML file with its CSS and JS inline, minifying all three together is the difference between a lean payload and a bloated one.
-
Trimming generated markup
Output from a templating engine, a CMS, or an email builder often ships unminified. Run it through here to recover the bytes before it reaches your users.
See also
Need to read it instead of shrink it? TheHTML Beautifier expands minified markup back into a readable document, and for stylesheets on their own theCSS Minifier compresses CSS the same way.
What minifying HTML really does
Minifying is not obfuscation, and it is not the same as gzip compression. It removes characters a browser does not need while keeping the rendered result identical. Here is what goes, and why it is safe.
-
Whitespace between tags
The indentation and line breaks that make markup readable are mostly ignored by the browser, so they are collapsed. The exceptions are whitespace inside pre and textarea, and the single spaces between inline elements that can affect layout, which are kept.
-
Comments
HTML comments are written for people and never render, so they are removed in full. Conditional comments are the exception, since they target specific browsers, and they are preserved.
-
The embedded code
Styles and scripts live inside the HTML, so a minifier that only touched the markup would leave most of the weight in place. Minifying the CSS in <style> and the JS in <script> is what makes a real page genuinely smaller.
-
It is safe, not lossy
Minification only removes what the browser does not need to render the page the same way. It is not obfuscation: the markup still works identically, it is just no longer formatted for a human to read.
-
Why gzip is the number that counts
Servers send HTML compressed with gzip or brotli, and those already collapse repeated whitespace. Minifying still helps, because it removes what compression cannot and hands the compressor cleaner input, but you should judge the gain by the gzip size rather than the raw bytes.
-
Minify for production, keep the source readable
Minified HTML is painful to edit, so it belongs in your build output, not your repository. Keep the readable template as your source, and minify as the last step before it ships.
Best practices
Habits that keep minified HTML both small and free of surprises.
- Minify as the last step of your build and deploy the result. Never hand-edit minified HTML or commit it as your source of truth.
- Measure the gain by the gzip figure, since that is what the server actually transfers. A large raw saving can shrink to little once compression is applied.
- Keep Minify CSS and Minify JS on for production, so the embedded code is compressed along with the markup, not left as the heaviest part of the file.
- Serve the minified file with gzip or brotli enabled and a sensible cache lifetime. Minification and transport compression stack, they do not replace each other.
- Watch whitespace-sensitive spots: if a layout relies on the space between inline elements, confirm it still looks right after minifying, since that spacing is meaningful.
Limitations
What this tool does, and what it leaves to other steps.
- It minifies a single HTML document along with the CSS and JS embedded in it. It does not fetch linked stylesheets, scripts, or images.
- It will not transpile modern JS, add vendor prefixes to the CSS, or down-level anything for old browsers. Pair it with a build tool for that.
- Template languages such as Handlebars, Jinja, or ERB are not HTML on their own; minify the rendered output instead of the template source.
- A syntax error stops minification and is reported rather than worked around, so badly broken input will not produce partial output.
FAQ
Common questions about minifying HTML, what it changes, and when to use it.
Does minifying change how my page renders?
No. Minification only removes characters the browser does not need, such as the whitespace between tags and comments that never render. Whitespace that affects layout, like the text inside pre and the spacing between inline elements, is preserved, so the rendered page looks identical before and after.
Does it minify the CSS and JavaScript inside my HTML?
Yes. The CSS inside every <style> block and the JavaScript inside every <script> block are minified along with the markup, each with a toggle so you can turn them off. On a real page the embedded code is often most of the weight, so this is where much of the saving comes from.
What is the difference between minifying and gzipping?
They work together. Minifying edits the HTML itself, removing content a compressor cannot know is unnecessary. Gzip or brotli then compresses whatever you send, collapsing repetition on the wire. You want both: minify first for the cleanest input, then let the server compress it. Judge the real gain by the gzip figure shown here.
How much smaller will my HTML get?
It depends on how the source was written. Generously formatted markup with large inline styles and scripts can drop substantially, while already-tight pages shave less. Once gzip is in play the percentage shrinks, because compression had already recovered much of the whitespace, which is why the gzip number is the honest one.
Should I commit the minified HTML to my repository?
No. Minified HTML is a build artifact, not source. Commit the readable template or document that you and your teammates edit, and generate the minified file as the final step before it is served. Checking in minified output makes reviews hard to read and merges painful.
Can I minify a template file like Handlebars or Jinja?
Not directly. This tool minifies standard HTML, which is what a browser receives. Template syntax such as {{ }} or {% %} is not valid HTML on its own, so minify the rendered output instead, or use a tool built for your template language.
Is my HTML uploaded anywhere?
No. Everything runs in your browser. The HTML you paste, any file you upload, and the result are processed locally, never transmitted or stored, and disappear the moment you close the tab, so even private or unreleased markup is safe.
Related tools
Keep going with the rest of the data and format toolkit.