Minifier CSS
Minify CSS dengan CSSO: menghapus spasi dan komentar, memperpendek warna dan nilai, serta menggabungkan aturan dengan aman. Menampilkan byte yang dihemat.
Berjalan sepenuhnya di browser Anda. Data Anda tidak pernah diunggah.
Alat Terkait
Lihat SemuaApa itu Minifier CSS?
Minifier CSS mengompres stylesheet dengan CSSO, optimizer struktural. Selain menghapus spasi dan komentar, ia memperpendek nilai (#ff0000 → red, 0px → 0), menggabungkan aturan duplikat, dan menghapus deklarasi berlebih bila itu tidak mengubah hasil.
Cara menggunakan Minifier CSS
- Tempel CSS Anda ke kotak input.
- Klik Minify (keluaran juga diperbarui saat Anda mengetik).
- Periksa baris ukuran untuk melihat penghematannya.
- Salin atau unduh CSS yang sudah di-minify.
Contoh
a { color: #ff0000; margin: 0px 0px; } /* c */ a{color:red;margin:0} Kapan menggunakan Minifier CSS
Pakai untuk build produksi situs kecil, blok <style> inline, atau CSS yang disimpan di CMS. Jika build Anda sudah memakai bundler dengan cssnano/lightningcss, tetap pakai itu. Pertahankan komentar lisensi secara manual jika lisensi Anda mewajibkannya.
Cara kerja Minifier CSS
Pertama, pemindaian cepat memeriksa kurung kurawal, string, dan komentar serta melaporkan blok tidak seimbang beserta posisinya. CSS lalu diteruskan ke csso.minify dengan restrukturisasi aktif: CSSO mem-parse-nya menjadi AST (css-tree), menerapkan kompresi nilai yang aman dan penggabungan aturan, lalu mencetak hasilnya tanpa spasi. Komentar dihapus, termasuk komentar lisensi /*! … */.
Kasus Penggunaan Umum
- Me-minify stylesheet mandiri untuk landing page
- Memperkecil critical CSS sebelum di-inline
- Mengompres CSS yang disimpan di database atau CMS
- Membandingkan ukuran yang dioptimalkan dengan aslinya
Catatan Keamanan
Semuanya berjalan secara lokal di browser Anda; kode yang Anda tempel tidak diunggah.
Pertanyaan Umum
Bisakah minifikasi merusak CSS saya?
CSSO hanya menerapkan transformasi yang menjaga hasil cascade tetap sama, tetapi selalu uji keluarannya.
Mengapa #ff0000 menjadi red?
red lebih pendek dan berarti warna yang persis sama.
Apakah komentar lisensi dipertahankan?
Tidak, semua komentar dihapus. Tambahkan kembali lisensi secara manual jika diperlukan.