Lewati ke konten
NewKitApp

Search tools

Jump to any tool by name

CSS Minifier

Hapus komentar dan spasi dari CSS untuk mengurangi ukuran file.

What is CSS Minifier?

CSS Minifier menghapus komentar dan spasi yang tidak perlu dari file CSS untuk menguranginya untuk produksi, sepenuhnya di browser Anda. Ini menghapus komentar `/* ... */`, menggabungkan setiap run spasi, tab, dan baris baru di luar nilai string yang dikutip, dan menghilangkan titik koma redundan di akhir tepat sebelum kurung penutup — semuanya sambil dengan hati-hati meninggalkan nilai string yang dikutip (seperti teks properti `content`) sepenuhnya tidak tersentuh, sehingga tidak ada yang di dalam string yang sebenarnya dikompresi atau diubah. Ini menunjukkan kepada Anda tepat berapa banyak byte dan persentase yang Anda hemat, sehingga Anda dapat melihat dampak nyata sebelum mengirim hasilnya.

How to Use CSS Minifier

  1. Tempel CSS Anda ke dalam kotak input.
  2. Hasil yang diminyikan muncul secara instan di bawah, bersama dengan byte dan persentase yang disimpan.
  3. Salin CSS yang diminyikan dengan tombol salin.

Examples

Aturan yang dikomentari dan diindentasi

Input: .a { /* warna aksen */ warna: merah; }

Output: .a{warna:merah}

Beberapa deklarasi

Input: .a { warna: merah; latar belakang: #fff; }

Output: .a{warna:merah;latar belakang:#fff}

Common Mistakes

  • Minifikasi CSS sebagai satu-satunya salinan yang berfungsi — selalu simpan file sumber yang diformat dan dikomentari, dan minify salinan darinya, bukan sebaliknya.
  • Mengharapkan optimasi selector atau properti-level (penghapusan duplikat, penggabungan shorthand) — alat ini hanya menghapus whitespace dan komentar, bukan redundansi semantik.
  • Lupa bahwa CSS yang diminyikan jauh lebih sulit untuk di-debug di browser devtools — kembali ke sumber, atau simpan versi yang dibuat dengan indah.
  • Menganggap file kecil selalu berarti lebih cepat dimuat — untuk sebagian besar situs, kompresi gzip/Brotli sudah menghapus sebagian besar manfaat dari penghapusan whitespace manual; ini masih perlu dilakukan tetapi bukan solusi ajaib.

Why Use This Tool

  • Diproses sepenuhnya di sisi klien — CSS Anda tidak pernah meninggalkan browser Anda.
  • Isi literal string dilindungi dari penghapusan whitespace.
  • Menunjukkan persis berapa banyak byte dan persentase yang disimpan.
  • Minifikasi instan, langsung tanpa tombol submit.

Frequently Asked Questions