Code Minifier

What is the Code Minifier?

The Code Minifier strips whitespace, line breaks and comments from HTML, CSS, JavaScript, JSON and XML so the file you ship is smaller and downloads faster. Paste code, pick the language (or Mixed for an HTML page with inline styles and scripts), click Minify and read the size before and after. It also works the other way: Beautify re-indents minified or machine-generated code so you can read and edit it. Everything runs in your browser; your source is never sent anywhere.

How to use it

1. Choose the language from the dropdown. Use Mixed for a full HTML document that contains <style> and <script> blocks.
2. Paste your code into the editor.
3. Click Minify. The output appears below with the original size, the minified size and the percentage saved.
4. Click Copy or Download to take the result away. Keep your original in version control and only deploy the minified copy.
5. Need to read it again later? Paste the minified version and click Beautify.

Features

• Five languages plus Mixed. HTML, CSS, JavaScript, JSON and XML, each with rules that respect what must not be touched (string contents, pre blocks, regular expressions).
• Two-way. Minify for production, Beautify for debugging.
• Byte counter. Exact input and output sizes so you know whether the change was worth it.
• Runs offline. Proprietary code stays on your machine.
• No limits. Paste a 2 MB bundle if you like.

What minification does and does not save

Removing whitespace and comments typically cuts CSS by 15 to 30 percent and hand-written JavaScript by 20 to 40 percent before gzip. After gzip or Brotli, which every decent host applies, the difference shrinks to a few percent, because compression already handles repeated whitespace well. Minification is still worth doing because the browser has to parse every byte it receives, but the bigger wins usually come from removing unused CSS, splitting large JavaScript bundles and deferring scripts that are not needed for the first paint. For the honest numbers and when minification can break a site, read minifying CSS and JavaScript: what it saves, when it breaks things, and how to do it safely.

Things that can break

• JavaScript that relies on automatic semicolon insertion. If a script breaks after minifying, add the missing semicolons and try again.
• HTML where whitespace is significant, such as inline-block layouts that depend on the space between tags, or <pre> and <textarea> contents.
• Conditional comments and template markers that look like ordinary comments. Check the output if your code uses them.
• JSON with comments is not valid JSON; the minifier removes them, which is usually what you want.

Related tools

Tidy code before committing with the HTML, CSS & JavaScript Formatter, validate API responses with the JSON Formatter & Validator, and check the compression headers your server sends with the HTTP Header Checker.

Frequently asked questions

Does minifying change how the code behaves?

It should not. Whitespace and comments have no effect on execution in CSS, JSON or XML, and in JavaScript only in the semicolon edge case above. Variable names are not shortened, so stack traces stay readable.

Is this the same as what Webpack or Vite do?

Bundlers go further: they rename variables, drop dead code and tree-shake imports. This tool is for quick one-off minification, for sites without a build step, and for checking how much a file will shrink.

Is my code stored?

No. Processing is done in your browser and nothing is transmitted.

Can I minify a whole HTML page with inline CSS and JS?

Yes, select Mixed and each block is handled with its own rules.