UtilityKit

500+ fast, free tools. Most run in your browser only; Image & PDF tools upload files to the backend when you run them.

HTML Minifier

Minify HTML by removing comments and unnecessary whitespace while preserving valid markup.

About HTML Minifier

HTML Minifier removes all characters from an HTML document that are not required by the browser to render it correctly — leading and trailing whitespace, inter-element line breaks, HTML comments, optional closing tags, and redundant attribute quoting. The result is a smaller file that transfers faster, parses faster, and costs less to cache. Paste any HTML document or fragment and the tool returns the minified version alongside a before/after byte comparison. Unlike a simple whitespace stripper, a proper HTML minifier understands which whitespace is significant (inside <pre> or inline text) and which is purely structural — and removes only the latter. It also removes HTML comments, which are invisible to users but add payload bytes in every page response.

Why use HTML Minifier

Faster Time-to-First-Byte

Every byte removed from an HTML response is processed sooner by the browser. Minified HTML reduces TTFB for uncached responses and decreases the payload the CDN edge must forward to the client.

Comment Stripping

HTML comments like <!-- TODO: fix this --> or conditional IE comments are invisible to users but increase every response's payload. Stripping them in production eliminates bytes that have no user-facing value.

Optional Tag Removal

The HTML5 spec permits omitting certain closing tags (</li>, </td>, </option>, </p>) without affecting parsing. Removing them can save hundreds of bytes on list-heavy or table-heavy pages.

Configurable Transformations

Aggressive minification is appropriate for static assets but risky in template languages where whitespace inside expressions matters. Individual options let you enable only the transformations that are safe for your specific HTML.

Compounds Well with Gzip

Minification and compression are complementary, not competing. Removing repetitive structural characters before gzip gives the compression algorithm more consistent patterns to work with, improving the compression ratio.

No Build Pipeline Required

Static sites, HTML email templates, and single-file utilities can be minified here without wiring up a gulp, webpack, or Vite build step. Paste, minify, deploy.

How to use HTML Minifier

  1. Paste your HTML document or template fragment into the left input panel.
  2. The minified output appears instantly in the right panel with byte savings shown below.
  3. Use the options checkboxes to control which transformations are applied — comments, optional tags, whitespace, and attribute quotes.
  4. Review the output for any inline elements where whitespace removal might affect visual rendering, and toggle options if needed.
  5. Click Copy to copy the minified HTML to your clipboard for immediate use.
  6. Click Download to save the output as a .min.html file for direct deployment or CDN upload.

When to use HTML Minifier

  • Before uploading a static HTML file to a CDN origin or S3 bucket for a production deployment.
  • When optimising HTML email templates where payload size affects deliverability and render speed in email clients.
  • After generating HTML from a templating engine to strip the human-readable whitespace added for template author convenience.
  • When running a Lighthouse audit that flags render-blocking HTML size as a performance opportunity.
  • Before publishing a single-file utility or code pen that needs to fit within an embed or paste size limit.
  • When comparing two versions of a template by first minifying both — to eliminate formatting-only diffs — before diffing for real changes.

Examples

Page header with comments and whitespace

Input: <!-- Site header - updated 2024 --> <header class="site-header"> <a href="/" class="logo"> <img src="/logo.svg" alt="Site Logo" /> </a> <nav class="main-nav"> <ul> <li><a href="/tools">Tools</a></li> <li><a href="/about">About</a></li> </ul> </nav> </header>

Output: <header class="site-header"><a href="/" class="logo"><img src="/logo.svg" alt="Site Logo"></a><nav class="main-nav"><ul><li><a href="/tools">Tools</a><li><a href="/about">About</a></ul></nav></header>

HTML with inline style and script blocks

Input: <div id="app"> <!-- Mount point --> </div> <style> #app { max-width: 1200px; margin: 0 auto; padding: 20px; } </style> <script> document.addEventListener('DOMContentLoaded', function() { console.log('Ready'); }); </script>

Output: <div id="app"></div><style>#app{max-width:1200px;margin:0 auto;padding:20px;}</style><script>document.addEventListener('DOMContentLoaded',function(){console.log('Ready');});</script>

Data table with optional closing tags

Input: <table class="data-table"> <thead> <tr> <th>Name</th> <th>Score</th> </tr> </thead> <tbody> <tr> <td>Alice</td> <td>98</td> </tr> </tbody> </table>

Output: <table class="data-table"><thead><tr><th>Name<th>Score</thead><tbody><tr><td>Alice<td>98</tbody></table>

Tips

  • Always test minified HTML in a browser before deploying — edge cases around inline whitespace can cause text to run together in rare layouts.
  • Keep the formatted source HTML in version control and only deploy the minified output; debugging minified HTML in production DevTools is painful.
  • If you use HTML comments for conditional IE loading (<!--[if lt IE 9]>), make sure the IE comment option is disabled before minifying.
  • For HTML emails, focus on comment removal and inter-element whitespace; avoid optional tag removal since some email clients have stricter parsers than browsers.
  • Combine with server-level gzip or Brotli — a 20% minification saving followed by 70% compression saving gives an overall 76% reduction in wire weight.

Frequently Asked Questions

Will minifying HTML break my page layout or JavaScript?▾
Whitespace between block elements is safe to remove. Whitespace between inline elements like <span> can affect text rendering. The tool protects inline content by default; for custom behaviour, use the whitespace toggle.
Does the minifier remove whitespace inside <pre> or <code> blocks?▾
No. Content inside <pre>, <code>, <textarea>, and <script> tags is preserved verbatim. Whitespace in those elements is significant and must not be modified.
What are optional closing tags and is it safe to remove them?▾
HTML5 allows certain closing tags to be omitted: </li>, </dt>, </dd>, </p>, </td>, </th>, </tr>, and a few others. Browsers parse these correctly without the tag. This is safe for all modern browsers.
Can I minify HTML that contains Jinja, Handlebars, or Twig template syntax?▾
Only if you minify the rendered output, not the source template. Template delimiters like {{ and {% can be broken by whitespace removal if the minifier doesn't understand template syntax.
Does the tool handle HTML with embedded <style> and <script> blocks?▾
Inline <style> content is passed through the CSS minifier and inline <script> content is minified as JavaScript. Both reduce overall page weight more aggressively than HTML whitespace removal alone.
Should I minify my HTML at build time or at the server level?▾
Both approaches work. Build-time minification is preferred for static sites since it produces fixed artefacts. Server-side minification via middleware is appropriate for dynamic pages but adds response latency.
What is the typical size reduction for a real HTML page?▾
Content-heavy pages typically save 8–20%. Framework-generated or template-heavy pages with large comment blocks can save 25–35%. The byte savings counter shows the exact reduction for your specific input.
Does removing attribute quotes change browser behaviour?▾
Attribute values that contain no spaces or special characters can legally be unquoted in HTML5 (e.g. class=nav instead of class="nav"). Browsers parse them identically; some linters flag unquoted attributes as a style issue.

Explore the category

CSS Minifier Minify CSS by removing comments and whitespace JavaScript Minifier Minify JavaScript by removing comments, trimming whitespace, and outputting cleaner code instantly in your browser. SQL Minifier Minify SQL by removing comments and redundant whitespace safely. HTML Formatter Beautify and indent raw HTML code HTML Entities Encoder Decoder Encode and decode HTML entities in named/basic and numeric modes. HTML Table to JSON Convert HTML table markup into JSON data
Base64 Images in HTML and CSS: When They Help and When They Hurt Embedding images as Base64 data URIs eliminates an HTTP request but increases file size by 33% and breaks caching. Here is when the trade-of Apr 2026 · 7 min

Glossary

Optional Closing Tags
HTML5 closing tags that browsers do not require to correctly parse the document, including </li>, </p>, </td>, and </tr>. Omitting them is spec-compliant and saves bytes.
Whitespace Collapsing
Reducing sequences of spaces, tabs, and newlines between HTML elements to nothing or a single space. Safe between block elements; must be done carefully between inline elements.
Render-Blocking
HTML, CSS, or JS resources that the browser must fully download and process before it can paint the first pixel of the page. Smaller HTML reduces the time spent in this blocking phase.
Time to First Byte (TTFB)
The time between a browser sending an HTTP request and receiving the first byte of the response. Smaller HTML files reduce TTFB on uncached requests.
Inline Script
JavaScript placed directly in an HTML file inside <script> tags rather than loaded from an external file. Minifying inline scripts as part of HTML minification reduces their byte count without a separate build step.
Attribute Quoting
In HTML5, attribute values containing only alphanumeric characters, hyphens, underscores, periods, and colons may be written without quotes. Removing quotes from eligible attributes saves a small number of bytes per attribute.