ZeroTool Workbench

HTML Minifier & Beautifier

Free browser-based HTML minifier and beautifier. Strip comments, collapse whitespace, or re-indent your markup — instant, no upload, no signup.

100% Client-Side Your data never leaves your browser Free · No Sign-Up

Related Tools

XML Formatter Format, beautify, and minify XML documents with syntax validation. HTML to JSX Converter Convert HTML to React JSX instantly in your browser. Handles className, htmlFor, inline style objects, camelCase events, self-closing tags, and comments. 100% client-side. HTML to Markdown Converter Convert HTML to Markdown instantly in your browser. Preserves headings, bold, italic, links, images, code blocks with language tags, GFM tables, and nested lists. 100% client-side. UUID Generator Generate v4 UUIDs instantly — single or batch. Color Converter Convert colors between HEX, RGB, and HSL formats with a live color preview. Regex Tester Test regular expressions in real time with match highlighting and capture group details.

How to Use

  1. Paste your HTML — a fragment or a full document with doctype — into the input panel.
  2. Click Minify to strip comments and collapse whitespace, or Beautify to re-indent the markup.
  3. For Beautify, choose 2 spaces, 4 spaces, or Tab from the indent dropdown.
  4. The status bar shows the savings after a minify (e.g. 12.4 KB → 8.1 KB (−34.6%)).
  5. Click Copy on the output panel to grab the result.

Worked Examples

Before minify

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- page metadata -->
    <title>Hello</title>
  </head>
  <body>
    <h1>Hello World</h1>
    <p>Some <strong>bold</strong> text.</p>
  </body>
</html>

After minify

<!doctype html><html lang="en"><head><title>Hello</title></head><body><h1>Hello World</h1><p>Some <strong>bold</strong> text.</p></body></html>

What Gets Minified

  • Whitespace between tags (inter-tag whitespace) is collapsed.
  • HTML comments are removed — except IE conditional comments (<!—[if IE]>).
  • Boolean attribute values like disabled="" are simplified to disabled.
  • Trailing whitespace inside text nodes is trimmed; internal runs collapse to single spaces.

What Stays Verbatim

  • Content inside <script>, <style>, <pre>, <textarea>, <code>, <samp>, <kbd>.
  • Attribute values, including quoted whitespace and inline event handlers.
  • The <!DOCTYPE> declaration.

When to Minify Production HTML

Most modern build pipelines minify HTML as part of the bundler step (Vite, Webpack, Astro, Next.js). Use this tool when you need a one-off minify — pasting from a CMS export, comparing before/after sizes, or sanity-checking a hand-written template. Beautify is the daily driver: paste minified HTML from production, get a readable copy to debug or diff.

FAQ

Will this break my JavaScript or CSS inside <script> and <style> tags?

No. Inline scripts and stylesheets are preserved verbatim. Only structural whitespace between tags and HTML comments outside <script>/<style> blocks are removed during minification.

Does my HTML get uploaded anywhere?

No. Processing runs entirely in your browser using the native DOMParser API. The markup never leaves your device — there is no server round-trip.

How much size reduction can I expect from minification?

Typical HTML files shrink 15–40% depending on indentation depth and comment density. The exact savings (original size, output size, percent) appear in the status bar after each minify.

What does Beautify do differently from formatting in my editor?

Beautify re-parses and re-indents your HTML from scratch — useful for normalizing inconsistently formatted markup, expanding one-line minified HTML, or applying a consistent style across exported output from a CMS or template engine.

Does it preserve the HTML5 doctype, attribute values, and inline event handlers?

Yes. The doctype, all attribute values, boolean attributes, and inline handlers like onclick / onload are kept exactly as written. IE conditional comments are preserved even when other comments are stripped.