Bagaimana saya memampatkan CSS dalam talian tanpa memasang apa-apa?

Tampal CSS anda ke dalam CSS input, atau lepaskan fail .css, kemudian klik Mampatkan CSS. Ulasan dan ruang putih berlebihan dibuang, dan anda boleh Menyalin hasilnya atau Memuat turunnya sebagai styles.min.css.

Adakah pemampat CSS mengekalkan ulasan lesen dan URI data dengan utuh?

Ya. Ulasan biasa dibuang, tetapi ulasan /*! license */ dikekalkan. Rentetan bertanda petik, nilai url() dan URI data ditokenkan secara berasingan, jadi peraturan ruang putih tidak mengubahnya.

Bagaimana saya menukar CSS yang dimampatkan kembali kepada kod yang boleh dibaca?

Klik Cantikkan CSS dan bukannya Mampatkan CSS. Kod diinden semula dengan dua ruang bagi setiap tahap, dan titik bertindih pemilih seperti a:hover dibezakan daripada titik bertindih sifat. Muat turun menyimpannya sebagai styles.css.

Apakah maksud nombor gzip di sebelah pengurangan?

Ia ialah anggaran saiz output selepas pemampatan gzip, diukur dengan API CompressionStream pelayar. Jika pelayar anda tidak mempunyai API itu, saiz gzip tidak dipaparkan.

Adakah CSS saya dihantar ke pelayan apabila saya memampatkannya?

Tidak. Pemampatan dilakukan oleh pentoken JavaScript yang berjalan dalam pelayar anda, tanpa perpustakaan luaran. Tiada apa dimuat naik, jadi anda boleh menggunakannya pada helaian gaya peribadi.

Adakah ia benar-benar percuma?

Ya. Setiap alat adalah percuma untuk digunakan, tanpa akaun dan tanpa kad kredit. Kerja dijalankan pada peranti anda dan bukannya pada pelayan kami, itulah yang menjadikannya percuma untuk dijalankan.

Adakah ia berfungsi pada peranti mudah alih?

Ya. Ia berjalan dalam pelayar mudah alih semasa di iOS dan Android, tanpa apa-apa untuk dipasang.

🗜️

Pemampat & Pemformat CSS percuma

Mampatkan CSS untuk mengurangkan saiz fail atau cantikkan CSS yang dimampatkan untuk kebolehbacaan. Segera, dalam pelayar anda.

Berjalan dalam pelayar andaTiada daftar, tiada tetingkap timbulTiada log masuk diperlukanPercuma selama-lamanya

Berfungsi luar talian selepas dimuatkan

atau lepaskan fail .css di bawah

Lepaskan fail .css di sini, atau klik untuk melayari

CSS · diproses pada peranti anda

atau tekan Ctrl+V untuk menampal daripada papan keratan

Layar fail

CSS Input

CSS Output

Output akan muncul di sini…

Kegunaan biasa

Minify CSS untuk Penggunaan PengeluaranKurangkan saiz fail CSS sebelum menggunakan kepada pengeluaran — pemuatan halaman lebih cepat dan kos lebar jalur yang lebih rendah.
Keindahan CSS Diminify untuk PenyahihanFormat CSS termampat atau dimeminify kepada kod yang boleh dibaca supaya anda dapat memeriksa dan menyahihan gaya.
Minify CSS untuk Templat E-melKompak CSS untuk templat e-mel HTML di mana saiz fail dan limpahan gaya sebaris penting.
Minify CSS untuk Tema WordPressKurangkan saiz helaian gaya tema WordPress tersuai untuk skor PageSpeed yang lebih baik.
Keindahan CSS untuk Semakan KodFormat fail CSS apa pun kepada kod bersih, bebas lekukan dan boleh dibaca siap untuk semakan dan kolaborasi.

Cara ia berfungsi

Alat ini menggunakan penoken CSS tulisan tangan, sifar-kebergantungan dibina sepenuhnya dalam JavaScript — tiada pustaka luaran, tiada panggilan pelayan. Penoken mengelaskan setiap aksara sebagai kod, komen, rentetan bertanda petik, atau nilai url() sebelum mengenakan sebarang transformasi, yang mencegah peraturan ruang putih daripada merosakkan kandungan rentetan, URI data, atau ungkapan calc().

1
Pas penokenan
Input CSS diimbas aksara-demi-aksara dan dipecah kepada token bertaip: segmen kod mentah, komen /* ... */, rentetan bertanda petik (mengekalkan jujukan escape), dan blok url(...). Ini memastikan transformasi dalam langkah seterusnya hanya menyentuh sintaks CSS sebenar — tidak pernah kandungan literal rentetan atau URI data.
2
Minifikasi atau pengindahan
Dalam mod minify, komen biasa dibuang (komen /*! lesen */ dikekalkan), larian ruang putih dalam token kod diruntuhkan kepada ruang tunggal, dan ruang putih berdekatan-tanda-baca sekitar { } : ; , > ~ dibuang. Ruang sekitar + dan - sengaja dibiarkan untuk mengelak merosakkan ungkapan calc(). Dalam mod indah, kod diminify dahulu kepada baseline bersih, kemudian ditoken semula dan diinden semula dengan penjejakan kedalaman dua-ruang dan pengesanan koma-pengisytiharan untuk membezakan koma property: value daripada koma pemilih seperti a:hover.
3
Anggaran saiz gzip
Selepas menghasilkan output, CompressionStream API asli pelayar digunakan untuk memampatkan hasil dengan gzip dan mengukur kiraan bait yang terhasil. Ini memberi anggaran saiz-pemindahan realistik sepadan dengan apa yang pelayan web dengan mampatan gzip akan hantar melalui rangkaian.
4
Salin atau muat turun
CSS yang diproses ditulis ke papan keratan melalui Clipboard API, atau dimuat turun sebagai styles.min.css (mod minify) atau styles.css (mod indah) menggunakan Blob dengan jenis MIME text/css. Peratusan pengurangan saiz dipaparkan secara langsung semasa anda menaip.

Alat berkaitan

✨

Pengoptimum & Pemampat SVG

Buang metadata, runtuhkan ruang putih, dan bulatkan perpuluhan untuk mengurangkan saiz fail SVG secara dramatik — pengurangan biasa 30-70%. Pratonton visual mengesahkan tiada yang rosak.

CubaFail kekal tempatan

🎨

Pemercantik CSS

Kemaskan CSS yang telah dikecilkan dengan inden yang konsisten, atau kecilkan CSS. Pilihan menyusun sifat mengikut abjad untuk perbandingan perubahan yang lebih mudah dijangka.

Cuba

📋

Pemformat JSON

Format, sahkan, kecilkan dan teroka data JSON. Paparan pokok, penyerlahan sintaks dan salinan satu klik.