HTML Minifier

Reduce your HTML file size by stripping whitespace, comments, and redundant characters — compressing inline CSS and JavaScript in the same pass. Smaller HTML documents improve Largest Contentful Paint (LCP), reduce Time to First Byte (TTFB) perception, and lower CDN egress costs for high-traffic pages.

Every operation runs entirely in your browser. Paste your template, click Minify, then copy or download the compressed output. No upload, no server, no account.

0 bytes

How HTML Minification Works

The minifier processes your HTML using a state machine that distinguishes between tag content, attribute values, preformatted elements, script blocks, and style blocks. This prevents it from accidentally collapsing whitespace inside <pre> or <textarea> elements where whitespace is meaningful.

Inline <script> blocks are passed through the JavaScript minifier and inline <style> blocks through the CSS minifier, so you get three-in-one compression in a single operation.

What Gets Removed vs. Preserved

Element	Removed	Preserved
Whitespace between tags	Newlines, tabs, extra spaces	Single space where needed for inline elements
HTML comments	`<!-- all comments -->`	IE conditional comments (if present)
Inline scripts	JS whitespace and comments inside <script>	String literals, regex patterns, necessary spaces
Inline styles	CSS whitespace and comments inside <style>	All CSS declarations and values intact
<pre> / <textarea>	Nothing — fully preserved	All whitespace exactly as authored

Before and After: Real Size Savings

Before minification

582 bytes

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Page metadata -->
    <meta charset="UTF-8" />
    <title>My Page</title>
    <style>
      /* Reset styles */
      body {
        margin: 0;
        padding: 0;
        font-family: sans-serif;
      }
    </style>
  </head>
  <body>
    <h1>Hello World</h1>
    <p>Welcome to my page.</p>
  </body>
</html>

After minification

308 bytes — 47% smaller

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"/><title>My Page</title><style>body{margin:0;padding:0;font-family:sans-serif}</style></head><body><h1>Hello World</h1><p>Welcome to my page.</p></body></html>

When to Minify HTML

Static Site Deployment

When deploying to Cloudflare Pages, Vercel, or Netlify, minifying HTML before upload ensures every visitor gets the smallest possible document. Static generators like Astro, Hugo, and Eleventy can integrate HTML minification into their build pipelines, but this tool is useful for quick spot-checks or one-off files.

HTML Email Optimization

Email HTML is often bloated with inline styles and legacy table layouts. Minifying reduces the message size, which matters for inbox delivery because email providers flag oversized messages and some truncate them at 102KB (notably Gmail). Whitespace removal in table-heavy email templates routinely saves 15–25%.

CMS Template Optimization

WordPress themes, Shopify Liquid templates, and Webflow exports often include developer comments, debug classes, and generous whitespace. Minify the exported or rendered HTML to benchmark how much overhead your theme is generating, and identify sections where a cache layer or server-side minification plugin would have the most impact.

Troubleshooting HTML Minification Issues

Text runs together after minification

This happens when inline elements like <a>, <span>, or <strong> are surrounded by whitespace that was providing visual separation. The minifier preserves a single space between inline tags to prevent this, but text at the edges of block elements can still collapse. Check that your CSS is using spacing instead of relying on whitespace between tags.

Inline JavaScript breaks after minification

If inline <script> blocks rely on newlines for Automatic Semicolon Insertion (ASI) — where JavaScript infers semicolons from line breaks — the JS minifier removing those newlines can cause parse errors. The fix is to add explicit semicolons to all statements in your inline scripts before minifying.

Output is longer than the input

This should not happen with typical HTML, but can occur if your original file is already minified or uses very short attribute values where the whitespace removal does not save bytes. It can also occur if inline JS minification re-escapes some characters. In practice, minification always reduces or maintains file size on uncompressed HTML.

Frequently Asked Questions

What exactly does HTML minification remove?

HTML minification removes inter-tag whitespace and newlines, HTML comments (), leading and trailing whitespace from text nodes, and redundant spaces inside tag attribute lists. It also collapses multiple consecutive whitespace characters into a single space within text content. This tool additionally runs inline <script> blocks through a JavaScript minifier and inline <style> blocks through a CSS minifier, compressing your entire document in one pass.

What does HTML minification preserve?

Content inside <pre>, <textarea>, and <code> elements is preserved exactly as-is, since whitespace is significant in those elements. Attribute values in double quotes are kept intact. The semantic meaning of every element, all class names, IDs, event handlers, and src/href attributes are never modified. The minified HTML renders identically to the original in every browser.

How much file size reduction can I expect?

Typical HTML files see 10–30% reduction purely from whitespace and comment removal. If your HTML contains large inline <style> or <script> blocks, the savings can reach 40–60% because CSS and JS minification compounds on top of the HTML compression. Files with many developer comments or generated code with extra blank lines show the highest savings. The byte counter in the tool shows you the exact reduction percentage.

Is HTML minification safe for production?

Yes, with one important caveat: inline JavaScript that relies on automatic semicolon insertion (ASI) can occasionally break when newlines between statements are removed. This is rare in well-written code but worth testing. The safest workflow is: minify, deploy to staging, run your test suite, then promote to production. For email HTML specifically, minification is generally safe because email clients do not execute JavaScript.

Should I minify HTML if I use a CDN or Gzip?

Yes — minification and Gzip/Brotli compression are complementary, not alternatives. Gzip compresses at the transport layer and decompresses before delivery. Minification reduces the raw byte count of the file permanently, which means Gzip also has less work to do and achieves better ratios. Together they typically outperform either technique alone by 5–15% additional savings.

How does HTML file size affect Core Web Vitals?

HTML is the first resource a browser requests — it is on the critical render path. A smaller HTML document reduces Time to First Byte (TTFB) perception for users on slow connections, and faster HTML parse completion unblocks the browser from discovering CSS and script resources sooner. This directly improves Largest Contentful Paint (LCP) and First Contentful Paint (FCP) scores in Google's PageSpeed Insights.

Is my HTML sent to a server when I use this tool?

No. All minification runs entirely inside your browser tab using JavaScript. Your HTML string never leaves your device, is never stored anywhere, and is not visible to FlowStack servers. This makes the tool safe for proprietary templates, internal admin panels, authentication pages, and any HTML that should remain private.