🗜️
🔍

Beautify Minified CSS for Debugging

Format compressed or minified CSS into readable code so you can inspect and debug styles.

Không cần đăng nhập
Input CSS · 565 B
Output CSS · 430 B24%
.nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background-color:#ffffff;border-bottom:1px solid #e2e8f0}.nav-link{color:#475569;text-decoration:none;font-size:0.875rem;font-weight:500;transition:color 0.2s ease}.nav-link:hover{color:#14b8a6}.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#f0fdfa,#e0f2fe)}
565 BInput
430 BOutput
24%Reduction

Debugging tips

🔍

Right-click → "Inspect" in browser DevTools often shows minified CSS. Paste it here to beautify it into readable, indented code for debugging.

💡

Third-party widget and plugin CSS is usually minified. Beautify it to understand the styles before overriding them in your own stylesheet.

✏️

After beautifying, use the "← Use as input" button to switch to minify mode — useful for edit-beautify-edit-minify workflows.

🧩

Beautified CSS preserves all rules exactly — no changes to selectors, values, or structure. It only adds whitespace and line breaks.

Cách hoạt động

1
Nhập liệu
Enter your data into the tool above. Everything stays local to your browser.
2
Xử lý
The tool processes your data instantly in your browser using JavaScript. No server, no waiting.
3
Tải xuống
Get your result instantly. Nothing is stored after you leave the page — complete privacy.

Tại sao chọn của chúng tôi?

Hoàn toàn miễn phí — không có chi phí ẩn, mãi mãi
Không cần tài khoản, email hoặc đăng nhập
Tệp không bao giờ rời khỏi thiết bị của bạn
Không có giới hạn kích thước tệp nào
Không có hình mờ trên bất kỳ đầu ra nào

Also check out…

Câu hỏi thường gặp