How to Minify HTML, CSS and JavaScript in the Browser to Cut Page Weight
Learn how the Code Minifier strips comments and whitespace from HTML, CSS and JS, what it leaves untouched, and when to check the output.
Code Minifier (HTML/CSS/JS)
Introduction
Every comment, indent and line break in a stylesheet or script is sent to the visitor's browser and parsed before anything renders. The Code Minifier removes that filler from HTML, CSS and JavaScript using simple pattern rules, so a snippet can be trimmed for a quick inline embed or a size check without installing a build tool. Everything runs in the browser and the code never leaves the page.
Step-by-Step Instructions
- Select the language tab (HTML, CSS or JS) above the editor so the right set of rules is applied.
- Paste the source into the Raw Input Code box, replacing the sample markup.
- Click Minify Code to produce the compressed version in the Minified Result pane.
- Scan the result for anything that should have stayed, such as a URL inside a JavaScript string that contained two slashes.
- Click Copy next to Minified Result to place the output on the clipboard.
Key Use Cases
- Inline critical CSS: Shrink a small block of above-the-fold styles before pasting it into a style tag.
- Email and widget snippets: Flatten an HTML fragment into a single line for an embed field that rejects line breaks.
- Quick size estimate: Compare the raw and minified character counts to see how much whitespace a file carries.
Frequently Asked Questions
What does each language mode actually remove?
HTML mode deletes comments, whitespace between tags, and collapses repeated spaces or line breaks into a single space. CSS mode drops block comments, removes spaces around braces, colons, semicolons and commas, then collapses remaining whitespace. JS mode strips block comments and line comments, then collapses whitespace to single spaces.
Is this a full minifier with variable renaming or dead code removal?
No. The tool applies regular expression replacements only. It does not rename identifiers, drop unused code, rewrite syntax or add missing semicolons, so JavaScript that relies on automatic semicolon insertion at line ends should be checked after minifying.
Why did part of my JavaScript disappear?
JS mode treats everything from a double slash to the end of the line as a comment, including a double slash inside a string such as https://example.com. Keep those strings on their own line or verify the output, because the tool does not parse string literals.