Programowanie webowe
CSS Minify / Beautify
Skompresuj CSS na potrzeby produkcji lub sformatuj zminifikowany CSS do czytelnej postaci.
Zbyt duży do podglądu
Zbyt duży do podglądu
Minifying CSS strips whitespace, comments, and line breaks that only exist for human readability and have no effect on how a browser applies styles. The result is a smaller file and a faster page load.
How to use it
- Minify: paste CSS and the tool strips unnecessary whitespace, comments, and line breaks while keeping behavior identical.
- Beautify: paste minified CSS with no indentation to get a readable version back, with indentation and line breaks.
- Handy for quickly reading CSS from a third-party site that only ships a minified version.
Common uses
- Minifying CSS for production when there's no build tool (Vite, Webpack) set up, or for a quick one-off minification.
- Beautifying minified CSS from a third-party library to read or debug it.
- Estimating how much a CSS file will shrink before setting up an automated build.
Things to keep in mind
Minification never changes styling behavior — it's a purely syntactic transformation; if a page looks different after minifying, that's a bug in the tool, not an intentional change.
Without a source map, debugging minified CSS in production is harder — the line numbers shown in the browser console won't match the original file.
Artykuł o tym narzędziu: Minifikacja CSS: co dokładnie jest usuwane z pliku i po co
Najczęstsze pytania
Co dokładnie minifikacja usuwa z mojego CSS?
Minify usuwa białe znaki, podziały linii i komentarze oraz skraca niektóre wartości, zmniejszając rozmiar pliku bez zmiany zachowania CSS.
Czy Beautify może idealnie przywrócić moje pierwotne formatowanie?
Beautify formatuje ponownie zminifikowany CSS z wcięciami i podziałami linii dla czytelności, ale nie może odzyskać komentarzy ani Twoich pierwotnych wyborów stylu, ponieważ zostały już usunięte podczas minifikacji.
Czy minifikacja jest bezpieczna dla każdego poprawnego CSS?
Tak — dla poprawnego składniowo CSS minifikacja tylko usuwa zbędne znaki i nigdy nie zmienia selektorów ani wartości właściwości, a wszystko odbywa się lokalnie w Twojej przeglądarce.
Czy nadal potrzebuję minifikacji, jeśli serwer już kompresuje pliki za pomocą Gzip?
Tak — minifikacja i kompresja Gzip/Brotli uzupełniają się nawzajem: minifikacja zmniejsza sam plik źródłowy jeszcze przed kompresją, a Gzip/Brotli dodatkowo kompresuje wynik podczas transmisji, dzięki czemu razem dają mniejszy końcowy rozmiar niż każda technika z osobna.
Czym jest source map dla zminifikowanego CSS?
Source map to osobny plik, który mapuje linie zminifikowanego CSS z powrotem na oryginalny, sformatowany kod, umożliwiając narzędziom deweloperskim przeglądarki wyświetlanie prawidłowych numerów linii i nazw plików podczas debugowania, nawet gdy na produkcję trafia właśnie zminifikowana wersja.