HCODX/HTML Minifier
100% browser-based · powered by html-minifier-terser

HTML Minifier — Minify HTML Online

Collapse whitespace, drop comments, simplify boolean attributes, optionally minify inline <style> and <script> blocks. Powered by html-minifier-terser — the modern fork of html-minifier used in production build pipelines.

Drop HTML file
.html, .htm, .xhtml, .txt
original.html
minified.html
Minification options
Original size
0 B
Minified size
0 B
Size reduction
0%
Bytes saved
0 B
450K+
Files Minified
60%
Average Reduction
35K+
Happy Developers
4.9 / 5
User Rating
Example

Strip the noise, keep the markup

Comments, redundant whitespace, redundant quotes, boolean-attribute noise — all gone, all without changing rendering.

Before
<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Page metadata -->
    <title>Hello</title>
    <link rel="stylesheet" type="text/css" href="style.css">
  </head>
  <body>
    <input type="text" disabled="disabled" value="hi">
  </body>
</html>
After
<!doctype html><html lang=en><head><title>Hello</title><link rel=stylesheet href=style.css><body><input disabled value=hi>
Use cases

Where minified CSS pays for itself

Smaller HTML payloads, faster Time-to-First-Byte rendering, lower bandwidth.

Performance budgets

30–60% smaller bundles directly improve First Contentful Paint and LCP scores.

Mobile networks

Every byte matters on cellular. Smaller stylesheets render faster on slow connections.

Bandwidth savings

For high-traffic sites, even 10 KB per request adds up to terabytes per month.

SEO & Core Web Vitals

Google factors page-load metrics into rankings; CSS minification is the simplest win.

Step by step

How to minify CSS

1

Paste or drop your CSS

Paste source CSS into the left editor or drop a .css file onto the upload area.

2

Pick options

Default is restructure ON, media-merge OFF (safer), strip comments ON. Adjust if your build needs comments preserved.

3

Click Minify

html-minifier-terser runs locally in your browser. The right editor fills with the minified result; stats below show the size reduction.

4

Copy or download

Copy with one click, or download as minified.css.

FAQ

Frequently asked questions

Stripping characters that the browser doesn't need to render: whitespace between tags, comments, attribute quotes around safe values, redundant attributes (type="text" on inputs), the verbose form of boolean attributes (checked="checked" → checked). The output renders identically but is typically 10–25% smaller.

The default options are conservative. Aggressive whitespace is the one toggle that can affect rendering — it collapses whitespace inside text content where the difference between one space and zero may matter. The library auto-skips <pre>, <textarea>, <script>, <style>, but always re-test before shipping.

Toggle Remove comments off. The library will keep all comments — including conditional comments for legacy IE support — when this is disabled.

Yes — toggle Minify inline CSS and Minify inline JS. The library calls clean-css and Terser respectively for embedded blocks. Off by default since most production HTML is mostly markup.

No. html-minifier-terser is loaded as a static UMD bundle from a CDN; everything runs in your browser.

About

About HTML minification

HTML minification is the smallest of the three main "minify your assets" wins (JS and CSS save more bytes), but it's still worth doing. Less HTML means less data to parse before the renderer can start work, and the savings compound when the same HTML is served thousands of times a day.

What this tool does

  • Collapses whitespace between tags (conservatively, by default)
  • Removes comments, including conditional IE comments if requested
  • Drops attribute quotes for values that don't need them
  • Simplifies boolean attributes (disabled="disabled" → disabled)
  • Removes redundant attributes (type="text/javascript" on <script>, type="text/css" on <link>, type="text" on <input>)
  • Optionally minifies inline <style>, <script>, style="…", and on-event attributes
  • Replaces <!DOCTYPE html PUBLIC "…"> with the modern <!DOCTYPE html>

Powered by html-minifier-terser

The transformation engine is html-minifier-terser, the actively-maintained fork of html-minifier. It calls clean-css for inline CSS and Terser for inline JS — both well-tested in production.

What it doesn't do

  • Tree-shake unused HTML. The minifier doesn't know which markup your JS will reference.
  • Strip script/link tags. Bundle splitting and asset pipelines belong in your build tool.
  • Validate HTML. If your input is malformed, the output may be too.