CSS & JS Minifier / Beautifier
Minify CSS and JavaScript to reduce file size for production, or beautify / format minified code for readability. Supports comment removal, zero shortening, color normalization, console removal, and more. Free, instant, nothing uploaded.
Free CSS & JS Minifier / Beautifier — Compress and Format Code Online
This free CSS and JavaScript minifier and beautifier reduces file sizes for faster page loads and formats compressed code back into readable, well-indented source. Minify CSS by removing comments, collapsing whitespace, shortening zero values, and normalizing color codes. Minify JavaScript by removing comments, collapsing whitespace, stripping console calls, and removing debugger statements. Beautify minified code with 2-space, 4-space, or tab indentation. Everything runs in your browser — nothing uploaded.
All Features
- CSS minifier — Removes comments, collapses whitespace, strips last semicolons, shortens 0px → 0, normalizes #aabbcc → #abc.
- JavaScript minifier — Removes comments, collapses whitespace, removes console.log/warn/error, removes debugger statements.
- CSS beautifier / formatter — Reformats compressed CSS with proper indentation and newlines.
- JavaScript beautifier / formatter — Reformats minified JS with indentation, brace formatting, and quote style options.
- Preserve license comments — Keeps /*! comments intact even when removing all other comments.
- Size savings display — Shows bytes saved, percentage reduction, and a visual size bar.
- Swap input/output — Instantly use the output as new input to chain operations.
- Upload files — Open .css, .js, .ts, .jsx, .tsx files directly.
- Download output — Save result as .min.css, .min.js, etc.
Frequently Asked Questions
What is CSS minification?
CSS minification removes all characters that are not required for the browser to parse and apply the stylesheet: comments, whitespace, newlines, redundant semicolons, and redundant characters in values (like 0px → 0 and #ffffff → #fff). Minified CSS is functionally identical to the original but significantly smaller, reducing download time and improving page performance.
How much can I reduce my CSS file size by minifying?
Typical well-commented, formatted CSS minifies to 40–65% of its original size. When combined with gzip or brotli compression on the server, the effective transfer size is typically 15–30% of the original uncompressed file. The exact savings depend on how much whitespace and how many comments the original contains.
What is the difference between minification and compression?
Minification removes unnecessary characters from the source code while keeping it syntactically valid. Compression (gzip, brotli) is a binary encoding applied by the web server that reduces the byte count further during transfer. They work together: minify first, then compress. Minified text compresses better than formatted text.
Is it safe to minify JavaScript with this tool?
Yes — this tool performs safe structural minification: removing comments, collapsing whitespace, and optionally removing console/debugger statements. It does not rename variables or perform dead code elimination. Always test your minified output before deploying to production.
What does "beautify" or "format" code mean?
Beautifying (formatting or pretty-printing) takes minified or poorly formatted code and adds proper indentation, newlines, and spacing to make it human-readable. Use it to read minified library code, understand third-party stylesheets, or restore formatting to code that has been compressed.
Why should I remove console.log from production JavaScript?
console.log statements in production JavaScript: (1) slightly increase file size, (2) expose debugging information to any user who opens browser DevTools, (3) can log sensitive data accidentally, and (4) have a small performance overhead. Enable "Remove console.log/warn/error" to strip them automatically during minification.
What is the difference between this tool and Terser or UglifyJS?
Terser and UglifyJS perform full JavaScript optimization including variable name mangling (renaming variables to single characters), dead code elimination, and constant folding. This tool performs structural minification only — removing whitespace and comments — which is simpler, safer, and runs without any installation or build setup. For production bundles, use Terser or esbuild via a build tool.