Jak zminifikować CSS online bez instalowania czegokolwiek?

Wklej swój CSS do Input CSS lub upuść plik .css, potem kliknij Minify CSS. Komentarze i zbędne odstępy są usuwane, a wynik możesz skopiować (Copy) lub pobrać (Download) jako styles.min.css.

Czy minifikator CSS zachowuje komentarze licencyjne i data URI w nienaruszonym stanie?

Tak. Zwykłe komentarze są usuwane, ale komentarze /*! license */ zostają. Ciągi w cudzysłowach, wartości url() i data URI są tokenizowane osobno, więc reguły dotyczące odstępów ich nie zmieniają.

Jak zamienić zminifikowany CSS z powrotem w czytelny kod?

Kliknij Beautify CSS zamiast Minify CSS. Kod jest ponownie wcinany po dwie spacje na poziom, a dwukropki w selektorach, takich jak a:hover, są odróżniane od dwukropków we właściwościach. Download zapisuje go jako styles.css.

Co oznacza liczba gzipped obok redukcji?

To szacunkowy rozmiar wyniku po kompresji gzip, mierzony za pomocą API CompressionStream przeglądarki. Jeśli Twoja przeglądarka nie ma tego API, rozmiar gzipped nie jest wyświetlany.

Czy mój CSS jest wysyłany na serwer podczas minifikacji?

Nie. Minifikację wykonuje tokenizer JavaScript działający w Twojej przeglądarce, bez zewnętrznej biblioteki. Nic nie jest przesyłane, więc możesz używać go do prywatnych arkuszy stylów.

Czy naprawdę jest za darmo?

Tak. Każde narzędzie jest darmowe, bez konta i karty kredytowej. Praca odbywa się na Twoim urządzeniu, a nie na naszych serwerach, co pozwala utrzymać ją za darmo.

Czy działa na urządzeniach mobilnych?

Tak. Działa w aktualnych przeglądarkach mobilnych na iOS i Androidzie, bez instalowania czegokolwiek.

🗜️

Minifikator i upiększacz CSS za darmo

Minifikuj CSS, aby zmniejszyć rozmiar pliku, lub upiększaj minifikowany CSS dla czytelności. Natychmiastowo, w Twojej przeglądarce.

Działa w przeglądarceBez rejestracji, bez wyskakujących okienekLogowanie nie jest wymaganeZa darmo na zawsze

Działa offline po wczytaniu

albo upuść plik .css poniżej

Upuść tutaj plik .css albo kliknij, aby wybrać

CSS · przetwarzane na Twoim urządzeniu

lub naciśnij Ctrl+V, aby wkleić ze schowka

Przeglądaj pliki

Wejściowy CSS

Wynikowy CSS

Wynik pojawi się tutaj…

Typowe zastosowania

Minifikuj CSS do Wdrażania ProdukcjiZmniejsz rozmiar pliku CSS przed wdrażaniem w produkcji - szybsze ładowanie stron i niższe koszty przepustowości.
Upiększ Zminifikowany CSS do DebugowaniaSformatuj skompresowany lub zminifikowany CSS do czytelnego kodu, abyś mógł inspektować i debugować style.
Minifikuj CSS do Szablonów EmailKompaktuj CSS dla szablonów email HTML, gdzie rozmiar pliku i wzdęcie stylu wbudowanego są ważne.
Minifikuj CSS do Motywów WordPressZmniejsz rozmiar niestandardowych arkuszy stylów motywów WordPress, aby uzyskać lepsze wyniki PageSpeed.
Upiększ CSS do Przeglądu KoduSformatuj dowolny plik CSS do czystego, wcięcia, czytelnego kodu gotowego do przeglądu i współpracy.

Jak to działa

To narzędzie używa ręcznie napisanego tokenizera CSS bez zależności, zbudowanego w całości w JavaScript — bez bibliotek zewnętrznych i wywołań serwera. Tokenizer klasyfikuje każdy znak jako kod, komentarz, ciąg w cudzysłowie lub wartość url() przed zastosowaniem jakichkolwiek przekształceń, co zapobiega uszkodzeniu zawartości ciągów, data URI czy wyrażeń calc() przez reguły dotyczące białych znaków.

1
Przebieg tokenizacji
Wejściowy CSS jest skanowany znak po znaku i dzielony na typowane tokeny: surowe fragmenty kodu, komentarze /* ... */, ciągi w cudzysłowach (z zachowaniem sekwencji ucieczki) i bloki url(...). Dzięki temu przekształcenia w następnym kroku dotyczą wyłącznie faktycznej składni CSS — nigdy zawartości literału tekstowego ani data URI.
2
Minifikacja lub upiększanie
W trybie minifikacji zwykłe komentarze są usuwane (komentarze /*! license */ są zachowywane), ciągi białych znaków w tokenach kodu są zwijane do pojedynczych spacji, a białe znaki przy znakach { } : ; , > ~ są usuwane. Spacje wokół + i - są celowo pozostawiane, aby nie psuć wyrażeń calc(). W trybie upiększania kod jest najpierw minifikowany do czystej postaci bazowej, a następnie ponownie tokenizowany i wcinany z dwuspacjowym śledzeniem głębokości i wykrywaniem dwukropków deklaracji, aby odróżnić dwukropki właściwość: wartość od dwukropków w selektorach, takich jak a:hover.
3
Szacowany rozmiar po gzip
Po utworzeniu wyniku natywne API CompressionStream przeglądarki kompresuje go algorytmem gzip i mierzy liczbę bajtów. Daje to realistyczny szacunek rozmiaru transferu, odpowiadający temu, co serwer WWW z kompresją gzip wysłałby przez sieć.
4
Kopiowanie lub pobieranie
Przetworzony CSS jest zapisywany do schowka przez Clipboard API lub pobierany jako styles.min.css (tryb minifikacji) albo styles.css (tryb upiększania) za pomocą obiektu Blob z typem MIME text/css. Procent zmniejszenia rozmiaru jest pokazywany na żywo podczas pisania.

Powiązane narzędzia

✨

Optymalizator i minifikator SVG

Usuń metadane, zwiń białe znaki i zaokrąglij liczby dziesiętne, aby dramatycznie zmniejszyć rozmiar pliku SVG — typowe redukcje o 30–70%. Podgląd wizualny weryfikuje, że nic się nie psuje.

WypróbujPliki pozostają lokalnie

🎨

Upiększacz CSS

Formatuj zminifikowany CSS z równymi wcięciami albo go minifikuj. Opcjonalne sortowanie właściwości alfabetycznie dla czytelnych różnic.

Wypróbuj

📋

Formatowanie JSON

Formatuj, waliduj, minimalizuj i przeglądaj dane JSON. Widok drzewa, podświetlanie składni i kopiowanie jednym kliknięciem.