Skip to content
codevory

HTML Minifier

Reduce the size of HTML by removing comments and collapsing whitespace. Pre-formatted text, scripts and conditional comments are left alone.

HTML Minifier: the tool

Paste HTML to remove comments and extra whitespace.

Input

Minified HTML

The result appears here.

How to use HTML Minifier

  1. Paste an HTML page or fragment, or press Example.
  2. The defaults remove comments, collapse runs of whitespace to a single space and minify <style> and JSON <script> blocks.
  3. Turn on Trim around block tags for the smallest result. Turn on Remove attribute quotes to save a little more on simple values.
  4. Review the result in your page, then copy it or download it as index.min.html.

Example

A small page with a comment, an inline style and a preformatted block. Default options first, then with Trim around block tags.

Input
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Codevory</title>
    <style>
      body { margin : 0 ; font-family : sans-serif }
    </style>
  </head>
  <body>
    <!-- main heading -->
    <h1 class="title   big">  Hello,   <em>world</em>!  </h1>
    <p>
      A paragraph with a <a href="/tools"   title="All tools">link</a>.
    </p>
    <pre>
  keep   this
    spacing
</pre>
  </body>
</html>
Default options
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Codevory</title> <style>body{margin:0;font-family:sans-serif}</style> </head> <body> <h1 class="title big"> Hello, <em>world</em>! </h1> <p> A paragraph with a <a href="/tools" title="All tools">link</a>. </p> <pre>
  keep   this
    spacing
</pre> </body> </html>
Trim around block tags
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><title>Codevory</title><style>body{margin:0;font-family:sans-serif}</style></head><body><h1 class="title big">Hello, <em>world</em>!</h1><p>A paragraph with a <a href="/tools" title="All tools">link</a>.</p><pre>
  keep   this
    spacing
</pre></body></html>

About this tool

In HTML, runs of spaces and line breaks render as a single space, so they can be collapsed without changing the page. The exception is text inside <pre> and <textarea>, where whitespace is displayed as written, and that content is never touched. The same holds for the code in <script> elements, which is left exactly as it is.

The default mode keeps one space wherever the original had whitespace, so the page looks the same. Trim around block tags removes the space next to elements such as div, p, li and section, which is safe when those elements are displayed as blocks, and is visible only if your CSS displays one of them inline. Remove attribute quotes writes class=btn instead of class="btn" when the value contains nothing that could end the attribute, and keeps the quotes otherwise.

The HTML is read with a tokenizer, not with search-and-replace, so a > inside an attribute value or a < in a script does not confuse it, and an unclosed comment, tag or script is reported with its position. It does not fix invalid markup, close missing tags or remove optional tags. Internet Explorer conditional comments are kept. For the best results, also enable gzip or Brotli on your server.

Frequently asked questions

Will minifying change how my page looks?

With the default options, no: whitespace is collapsed but never removed between inline content. Trim around block tags can show a difference only if your CSS makes block elements display inline, so check the result once.

Is the content of pre, textarea and script safe?

Yes. Whitespace in <pre> and <textarea> is shown to the visitor, so it is kept as written. The code in <script> is left alone, and only <style> and JSON scripts (such as JSON-LD) are minified.

Does it minify inline JavaScript?

No. Safely shortening JavaScript needs a real JavaScript parser. Use the JavaScript minifier for your scripts and paste the result back in.

Why did the tool report an error on my HTML?

It stops at something that is never closed: a comment, a tag, a quoted attribute value or a <script> or <style> element. The message gives the position where it starts.

How much smaller will my HTML be?

Usually 5 to 20 percent for hand-written pages with generous indentation. The status bar shows the exact numbers. Server compression gives a larger saving and works together with minification.

More developer tools