DT
DevToolKit
Clearly labeled tools
Tools
Workspaces
Resources
Browse tools
DT
DevToolKit
Practical PDF, image, developer, and everyday tools

Clearly labeled processing for everyday tasks.

Core processing runs in the browser for most tools. Server-backed and external-provider workflows are labeled separately. Basic tools are available without signup; individual limits vary by tool.

46 unique tools4 workspacesNo signup for basic tools
Browse toolsTrust Center
Tools
All toolsPDF workspaceImage studioDeveloper workbenchGeneral tools
Product
BlogSupportContact
Company
AboutTrust CenterPrivacy PolicyTerms of Use

© 2026 DevToolKit. Practical PDF, image, developer, and everyday tools with clearly labeled processing.

In-browserServer-backedExternal preview
amanhirut32@gmail.com
HomeToolsDeveloperCode Minifier

Code Minifier

  • In-browser
  • No signup
  • Copy-ready

Minify JavaScript, CSS, and HTML directly in your browser.

Core processing runs in your browser and does not upload this file for the task.

Preparing the editor...

The guide and instructions on this page are available while the tool loads.

Continue your workflow

  • Text Diff CheckerCompare original and minified text line by line. Not a syntax-aware diff.

What this Code Minifier tool does

Code Minifier takes pasted text and, after you select Minify code, writes a more compact string for one of three modes: JavaScript, CSS, or HTML. Default language is javascript. The input starts empty. The page does not upload files, bundle modules, transpile, or connect to a build pipeline.

JavaScript calls Terser’s minify (imported as minifyJS from “terser”). CSS and HTML never call Terser; they run minifyCss and minifyHtml in CodeMinifier.jsx. The subtitle “faster loading” is chrome copy. This component only rewrites text in the browser.

Supported input types and actual minification behavior

JavaScript
await minifyJS(input, { compress: !safeMode, mangle: !safeMode, format: { comments } }). If result.code is missing, it throws “Unable to minify JavaScript.” Other Terser failures show error.message or “Failed to minify code. Check syntax and try again.”
CSS
minifyCss: optional /*! preservation, strip /* */, then optionally collapse whitespace around {} : ; , > + ~ and turn ;} into }. No CSS parser.
HTML
minifyHtml: optional HTML comment stripping, then optionally drop newlines, collapse runs of spaces, and replace >\s+< with ><. No HTML parser and no separate minify of inline script or style.

The language buttons are explicit. The selected value is passed through; the tool does not sniff the textarea. Any third button other than javascript or css uses the HTML branch (today that is only html).

Whitespace, comments, strings, and syntax-sensitive content

Remove comments defaults on. Preserve important comments defaults off and is disabled until Remove comments is on. For JavaScript, Terser comments are “all” if removal is off; a /^!|@preserve|@license|@cc_on/i keep pattern if both toggles are on; otherwise false. For CSS, /*! … */ can be stashed then restored. For HTML, the keep regex is <!--(?!\s*!|\s*\[if)—comments that look like <!--! or <!--[if are not stripped when preservation is on; all <!-- … --> are stripped when it is off.

Collapse whitespace is shown only for CSS and HTML (default on). minifyCss does not protect quoted values or url() text before stripping spaces around punctuation, so strings and selectors can change. minifyHtml does not skip <pre>, <textarea>, or <script> content before deleting newlines and squeezing spaces. Safe mode skips that collapse for CSS/HTML even if the toggle stays on.

JavaScript whitespace and comments are Terser’s responsibility. Template literals and strings are not handled by the CSS/HTML regexes because JS does not use those functions.

Minification versus formatting, validation, bundling, and compression

  • Not a formatter or beautifier. There is no pretty-print path.
  • Not a linter or validator except insofar as Terser may throw on JS it cannot parse.
  • Not a bundler, tree-shaker of your app graph, or gzip/brotli compressor. “Saved” is UTF-8 byte difference of the two textareas via TextEncoder.
  • Not a TypeScript compiler or JSX transform.
  • Terser mangle (Safe mode off) may rename identifiers. That is not a proof the program remains equivalent in your environment.

A shorter string does not prove the code remains valid, equivalent, secure, compatible, or ready for production. Keep the original and test the result.

How to use the real controls

  1. Click JavaScript, CSS, or HTML in the Code language group. Default is JavaScript. Switching clears Minified output and the error; Input code stays.
  2. Paste into Input code. The counter shows characters, lines (split on CRLF/CR/LF), and estimated UTF-8 size.
  3. Click Options toggles as needed: Remove comments, Preserve important comments (disabled until Remove comments is on), Collapse whitespace (CSS/HTML only), and Safe mode. Toggles do not re-minify.
  4. Click Minify code. The button is disabled while the trimmed input is empty or isMinifying is true (label Minifying...). Empty runMinify still sets “Paste some code to minify.”
  5. Click Load example to fill EXAMPLES[language] and call runMinify immediately.
  6. Click Clear to empty Input code, Minified output, the error, and Copied. It does not reset language or Options. Clear is disabled while both boxes are empty.
  7. Click Copy output (navigator.clipboard.writeText; Copied for 1.5 seconds; clipboard failure does not set a red error) or Download .min.js / Download .min.css / Download .min.html. Download writes a text/plain;charset=utf-8 Blob named output.min.js, output.min.css, or output.min.html. Both stay disabled while Minified output is empty.

How to review output before use

The sidebar Original size and Minified size use the current textarea contents. If you edit Input code after a successful minify and do not run Minify code again, Saved and Lines removed compare the new input to the old output.

No reduction / No meaningful size reduction appears when output exists and minifiedBytes is not smaller than originalBytes. Lines removed is max(0, input lines − output lines), not a statement about deleted logic.

Limitations and unsupported syntax

  • No TypeScript, JSX, JSON, SVG, or SQL language mode.
  • No file import and no implemented character ceiling (the browser and Terser still bound large pastes).
  • CSS/HTML paths are not syntax-aware; they can alter strings, HTML text nodes, and inline scripts.
  • HTML comment preservation does not implement a full IE conditional-comment parser.
  • Changing language does not convert the source; it only picks the next minify function.

Privacy and browser-processing boundaries

CodeMinifier.jsx minifies in the browser. It does not call trackToolEvent and does not POST the textarea to a minify API. Terser runs as an imported library in that same page. That is not a confidentiality guarantee: the rest of the page can still load site assets and advertising; the privacy policy describes first-party analytics for event metadata (not designed to store tool contents); clipboard, downloads, extensions, and shared devices remain outside this component.

The amber note says minification is for production output and to keep readable source for editing. Local Terser/regex does not encrypt the code.

Pre-production checklist

  • Keep a copy of the original; this page is not a source repository.
  • Confirm the language button matches the paste (JS vs CSS vs HTML).
  • If you used Collapse whitespace on HTML/CSS, check <pre>, text nodes, and CSS strings.
  • If Safe mode was off for JavaScript, test runtime behavior after Terser compress/mangle.
  • If a license header must survive, enable Remove comments and Preserve important comments, then inspect the output.
  • Re-minify after option or input edits; downloads use the current language’s extension even if the text is the other kind.
  • Do not treat Saved % as a performance measurement of your website.

When another DevToolKit tool is more appropriate

  • Text Diff Checker — to compare the original paste with minified output line by line (positional compare, not a JS/CSS-aware diff).
  • JSON Formatter — when the text is JSON. This minifier has no JSON mode; running JSON through Terser is not JSON.stringify pretty-print.
  • SQL Formatter — when the text is SQL. Minify SQL lives on that page, not here.

Frequently asked questions

Does Minify code run as I type?

No. Output updates when you select Minify code or Load example. Option toggles and typing do not re-run. Changing JavaScript/CSS/HTML clears the current output.

Is TypeScript, JSX, JSON, or SVG a supported mode?

No. LANGUAGES is only javascript, css, and html. There is no auto-detect. JSON should use JSON Formatter. SQL minify is on SQL Formatter. TypeScript/JSX is not a Terser language mode here.

Does a smaller byte count mean the code is equivalent?

No. Terser compress/mangle (when Safe mode is off) rewrites JavaScript. CSS/HTML collapsing does not protect strings, <pre>, or <script> bodies. Test the output. Keep the original.

What does Safe mode change?

For JavaScript, minifyJS sets compress and mangle to false. For CSS and HTML, minifyCss/minifyHtml return after comment handling and trim, ignoring Collapse whitespace. The on-screen “Safe basic minification” line is UI copy, not a guarantee.

Related tools

Common next steps after using this tool.

Text Diff Checker

Compare two blocks of text line by line directly in your browser.

Explore more in Developer

Browse related tools or open the full workspace.

Developer workspaceAll tools