Code Minifier and Beautifier

Make code smaller or readable again

Minified code loads faster; beautified code is easier to read and review. This tool does both for HTML, CSS and JavaScript, and shows how many bytes you saved.

Minify

Choose a language, paste the code and keep Action on Minify.

• CSS: comments and extra whitespace are removed, the last semicolon in each rule is dropped and zero lengths such as 0px become 0. Strings and url() values are protected.
• HTML: comments and the whitespace between tags are removed. Content inside pre, textarea and script elements is left exactly as written, and embedded style blocks are minified as CSS.
• JavaScript: Terser compresses the code and can shorten local variable names. Switch "Shorten variable names" off if you want compression without renaming.

Beautify

Switch Action to Beautify to reformat minified or untidy code with Prettier. Choose two, four or eight space indentation, or tabs. This is ideal for reading a minified file from a third party, cleaning up pasted snippets or checking what a build step produced.

Why the libraries load on demand

Terser and Prettier are large. They are fetched only when you first minify JavaScript or beautify, so the page opens quickly and you only download what you use. After the first load they work offline in the same tab.

Good practice

1. Keep your source files. Minified output is not meant for editing.
2. Test after minifying, especially JavaScript that relies on function names or eval.
3. Combine with compression. Serve files with gzip or Brotli on top of minification for the best results.
4. Do not minify twice. The second pass saves almost nothing.
5. Use source maps in real projects so errors in production map back to your original code.

Privacy

Your code never leaves your browser. There is no server step and nothing is logged.