Pređi na glavni sadržaj
LibraTool logoLibraTool

CSS minifikator i ulepšavač — besplatno

Minifikujte CSS da smanjite veličinu fajla ili ulepšajte minifikovani CSS radi čitljivosti. Trenutno, u vašem pregledaču.

Radi van mreže kada se učita
ili prevucite .css datoteku ispod

Prevucite .css datoteku ovde ili kliknite da je izaberete

CSS · obrađeno na vašem uređaju

ili pritisnite Ctrl+V da nalepite iz privremene memorije

Pretraži fajlove
Ulazni CSS
Izlazni CSS
Izlaz će se pojaviti ovde…

Uobičajene upotrebe

  • Minifikujte CSS za razvoj proizvodnjeSmanjite veličinu CSS datoteke pre razvoja u proizvodnji — brže učitavanje strana i niži troškovi propusne sposobnosti.
  • Olepšajte minifikovani CSS za otklanjanje grešakaFormatirajte kompresovani ili minifikovani CSS u čitljiv kod tako da možete inspektirati i otklanjati stilove.
  • Minifikujte CSS za šablone imejlaKompaktno CSS za HTML šablone imejla gde su veličina datoteke i inlineiniš stilski porast važni.
  • Minifikujte CSS za WordPress temeSmanjite veličinu prilagođenih CSS-ova WordPress teme za bolje PageSpeed rezultate.
  • Olepšajte CSS za pregled kodaFormatirajte bilo koju CSS datoteku u čistog, nazubljena, čitljiv kod spreman za pregled i saradnju.

Kako funkcioniše

Ova alatka koristi ručno napisan CSS tokenizator bez ijedne zavisnosti, izgrađen u potpunosti u JavaScript-u — bez spoljnih biblioteka, bez poziva serveru. Tokenizator klasifikuje svaki znak kao kod, komentar, niz pod navodnicima, ili url() vrednost pre primene bilo kakvih transformacija, što sprečava da pravila razmaka oštete sadržaj niza, data URI-je, ili calc() izraze.

  1. 1
    Prolaz tokenizacije
    Uneti CSS se skenira znak po znak i deli na tipizovane tokene: sirovi segmenti koda, komentari /* ... */, nizovi pod navodnicima (čuvajući sekvence bekstva), i url(...) blokovi. Ovo obezbeđuje da transformacije u sledećem koraku dodiruju samo stvarnu CSS sintaksu — nikada sadržaj literala niza ili data URI-ja.
  2. 2
    Minifikacija ili ulepšavanje
    U režimu minifikacije, obični komentari se uklanjaju (komentari /*! license */ se čuvaju), nizovi razmaka u kod tokenima se svode na jedan razmak, i razmaci uz interpunkciju oko { } : ; , > ~ se uklanjaju. Razmaci oko + i - se namerno ostavljaju netaknuti da ne bi pokvarili calc() izraze. U režimu ulepšavanja, kod se prvo minifikuje do čiste osnove, zatim ponovo tokenizuje i ponovo uvlači sa praćenjem dubine od dva razmaka i detekcijom dvotačke deklaracije da razlikuje dvotačke svojstvo: vrednost od dvotačaka selektora kao a:hover.
  3. 3
    Procena veličine gzip
    Nakon proizvodnje izlaza, koristi se prirodni CompressionStream API pregledača da se rezultat kompresuje gzip-om i izmeri rezultujući broj bajtova. Ovo daje realističnu procenu veličine prenosa koja odgovara onome što bi veb server sa gzip kompresijom poslao preko mreže.
  4. 4
    Kopiraj ili preuzmi
    Obrađeni CSS se upisuje u privremenu memoriju preko Clipboard API-ja, ili preuzima kao styles.min.css (režim minifikacije) ili styles.css (režim ulepšavanja) koristeći Blob sa MIME tipom text/css. Procenat smanjenja veličine se prikazuje uživo dok kucate.

Slične alatke

✨

SVG optimizator i minifikator

Uklonite metapodatke, skupite razmake i zaokružite decimale da biste dramatično smanjili veličinu SVG fajla — tipična smanjenja od 30–70%. Vizuelni pregled potvrđuje da ništa nije pokvareno.

IsprobajteFajlovi ostaju lokalni
🎨

CSS ulepšavač

Formatirajte minifikovani CSS sa doslednim uvlačenjem ili ga minifikujte. Opciono abecedno sortiranje svojstava za predvidljive razlike.

Isprobajte
📋

Formatiranje JSON-a

Formatirajte, proveravajte, minimizujte i istražujte JSON podatke. Prikaz stabla, osvetljavanje sintakse i kopiranje jednim klikom.

Isprobajte

Česta pitanja