What is the difference between CSS Minifier and Variables Refactor?
CSS Minifier focuses on reducing file size for faster delivery. Variables Refactor focuses on code structure by extracting repeated values into reusable :root variables.
CSS Optimization
CSS Decompressor
CSS Decompressor expands minified CSS/SCSS/LESS-like code into structured readable output with proper indentation, rule nesting, and declaration layout.
Minified input
Readable result
Key features
Two tools in one page
Switch between CSS Minifier and Variables Refactor in one workspace for both performance and maintainability tasks.
Multi-format minification
Optimize CSS, SCSS, SASS, LESS, and Stylus-like files with safe, balanced, or maximum compression modes.
Automatic variables extraction
Detect repeated values and convert them into reusable CSS variables to build cleaner token-based stylesheets.
Flexible output actions
Copy or download refactored CSS instantly, or export minified batches as ZIP for deployment pipelines.
Local processing
All transformations are executed in your browser to keep source styles private during optimization.
Plan-based daily limits
Free plan includes 10 style files per day. PRO and PREMIUM get unlimited daily optimizations.
CSS Decompressor: restore readable code from minified styles
CSS Decompressor expands minified CSS/SCSS/LESS-like code into structured readable output with proper indentation, rule nesting, and declaration layout.
Select input and output language modes to normalize mixed style sources and generate cleaner code for audits, refactors, and team reviews.
Use decompression before optimization to inspect cascades, duplicated values, and nested blocks, then continue with minification or variables refactor.
It works well for onboarding and audits when you receive minified third-party styles without source files. The readable output helps identify overrides, side effects, and dead rules faster.
For migrations between preprocessors or code standards, decompressed output becomes a stable starting point for cleanup, review, and further automation in your frontend workflow.
Useful links for style decompression workflow
CSS Optimization FAQ
Will Variables Refactor break my existing selectors or layout?
No. The tool only replaces repeated declaration values with var(--token) references and keeps selectors and property names intact.
Can I refactor only values repeated 3+ times?
Yes. In Variables Refactor tab you can choose the minimum repeat threshold, so only frequent values become CSS variables.
Is this tool suitable for production CSS optimization?
Yes. Use minification to reduce payload and variables refactor to improve maintainability, then export code for your build pipeline or direct deployment.