Code Minifier
Minify JavaScript, CSS and HTML instantly. Real-time size reduction stats. Free, private, no upload.
Input
Output
Minified output will appear here
About Code Minifier
Every unnecessary character in your JavaScript, CSS, and HTML adds bytes that users must download before your page renders. Whitespace, comments, long variable names, and unnecessary semicolons are all readable in source code but wasteful in production. Minification removes all of these without changing how the code executes, often reducing file sizes by 40–70%.
Our Code Minifier handles JavaScript with Terser — the same minifier Webpack and Vite use — running two compression passes, mangling local variable names and dropping comments and debugger statements. CSS is stripped of comments and whitespace, and its values are shortened where it is safe to do so: 0px becomes 0, #aabbcc becomes #abc, 0.5 becomes .5. HTML goes through html-minifier-terser, which collapses whitespace, removes comments and redundant attributes, uses the short doctype, and minifies inline `<style>` and `<script>` blocks along the way. The minified output is production-ready — it behaves identically to the source code but in far fewer bytes.
When combined with server-side gzip or Brotli compression, minified assets achieve even smaller file sizes over the network. A CSS file minified from 50 KB to 30 KB might transfer as only 8 KB gzipped. These savings compound across pages and return visits, improving Time to First Byte, First Contentful Paint, and Core Web Vitals scores — particularly for users on slower mobile connections.
How to Use Code Minifier
- 1Pick the language tab first — JavaScript, CSS or HTML — since switching tabs clears the editor.
- 2Paste your code into the input panel on the left.
- 3The minified result appears on the right automatically as you type — there is no button to press.
- 4Review the stats bar above the panels: original size, minified size, percentage saved and bytes saved.
- 5Click "Copy" for the clipboard, or the download button to save the result as a .js, .css or .html file.
- 6If the code has a syntax error, the output panel shows the parser message instead of the result.
Use Cases
- →Minify a JavaScript bundle for production deployment to reduce initial load time
- →Compress a CSS stylesheet before publishing a static website
- →Reduce HTML file size for email templates or landing pages where every byte counts
- →Quickly minify a third-party snippet to include inline in a webpage or email
- →Prepare minified assets for CDN delivery where smaller files reduce bandwidth costs
- →Reduce the size of generated CSS from CSS-in-JS tools before adding to a critical path
Tips
- ✓Always keep your original unminified source files — minified code is effectively uneditable
- ✓Minification plus gzip compression achieves even smaller transfers — both layers work together
- ✓Use the Code Formatter tool to reverse-minify (beautify) received code for debugging
- ✓JavaScript minification can rename local variables to single letters — safe for production, unreadable in debugging
- ✓For build pipelines, wire the same libraries into CI: Terser for JS and html-minifier-terser for HTML
- ✓The stats bar shows you the exact byte reduction so you can measure the impact
- ✓Terser handles modern syntax — arrow functions, template literals, destructuring, async/await, optional chaining
- ✓Minifying HTML also minifies the CSS and JavaScript written inline inside it
- ✓A syntax error stops the JavaScript pass — the parser message points at the line to fix
Frequently Asked Questions
Minification removes all unnecessary characters from source code — whitespace, comments, long variable names — without changing its behavior. The result is a smaller file that loads faster in browsers.
Typical results: JavaScript sees 60–80% reduction, CSS sees 30–60% reduction, HTML sees 10–30% reduction.
CSS and HTML minification is fully reversible — it only removes whitespace and comments. JavaScript minification with variable renaming is not easily reversible. Always keep your original source files.
JavaScript is minified using Terser, the industry-standard JS minifier used by Webpack, Vite, and most modern build tools.
Yes. Terser supports modern JavaScript including arrow functions, template literals, destructuring, async/await, optional chaining, and all ES2020+ features.
No. All minification runs entirely in your browser. Your code never leaves your device.