CSS Obfuscator & Deobfuscator
Scramble class & id names and compact your CSS to make stylesheets harder to copy. This tool obfuscates and deobfuscates CSS on one page — paste your code, pick a mode, and click. Everything runs on your device, nothing is sent to a server.
Everything runs in your browser. Your code is never sent to our servers.
Example
Example Input
/* main button */
.btn-primary {
color: #fff;
background: #00b8e6;
}Example Output
._0{color:#fff;background:#00b8e6}
/* obfuscation map: .btn-primary -> ._0 */How to Use
- 1Choose Obfuscate (to scramble) or Deobfuscate (to restore) mode at the top.
- 2Paste your CSS code into the Input field.
- 3Click the button (or press Ctrl+Enter) to process. The result appears in the Output field.
- 4Click Copy to copy the result.
About the CSS Obfuscator
The CSS Obfuscator disguises a stylesheet by stripping comments, compacting whitespace, and renaming every class (.name) and id (#name) to a short, meaningless token like ._0, ._1, and so on. The mapping is consistent across the whole stylesheet, so as long as you rename the matching names in your HTML, the appearance stays the same.
To keep the transform usable, an "obfuscation map" is appended as a comment at the end of the output — a legend of original names to tokens. With it you can update your HTML markup to match, or reverse the process later.
Deobfuscate mode reads that obfuscation map automatically and restores every token (._0, ._1, …) back to its original class/id name, then beautifies the CSS into a readable, indented format. So as long as the map still accompanies the CSS, the process is fully reversible. Declaration values such as hex colors (#fff, #00b8e6) are never touched — only selectors are renamed.
FAQ
What's the difference between obfuscating and minifying CSS?
Minifying only shrinks size (removes whitespace/comments) but stays easy to reverse. Obfuscating deliberately makes code HARD to read and reverse-engineer — renaming, disguising strings, and altering flow — while still running the same. For plain beautify/minify, use the Formatter.
Can this obfuscation be reversed?
Yes. As long as the "obfuscation map" still accompanies the CSS, Deobfuscate mode reads it automatically and restores the tokens (._0, ._1, …) to their original class/id names, then beautifies it. If the map was removed, deobfuscate still beautifies the formatting but names cannot be restored.
Is my code sent to a server?
No. CSS is processed entirely in your browser using JavaScript/WebAssembly. Your code never leaves your device.