Alat Visualisasi Spacing untuk Pengembang Web
Spacing Palette Overlay adalah alat bantu visualisasi yang dirancang untuk memudahkan pengembang dalam membaca setiap margin, padding, dan jarak pada halaman web. Dengan alat ini, pengguna tidak perlu lagi membuka DevTools untuk memeriksa gaya, karena seluruh halaman akan otomatis diberi warna berdasarkan ukuran px. Nilai px dikelompokkan menjadi tiga kategori warna yang berbeda: angka genap dalam warna oranye hingga merah, kelipatan 8 atau 4 dalam warna kuning-hijau, dan angka ganjil dalam warna biru muda hingga indigo.
Alternatif yang Direkomendasikan Teratas
Saat pengguna mengarahkan kursor, overlay yang tidak memiliki nilai px yang sama akan redup, sementara tooltip seperti “M 16px / P 8px” akan muncul di bawah pointer. Fitur Label Mode memungkinkan label px dipasang di tengah setiap overlay, sehingga memudahkan pembacaan jarak yang ditumpuk. Menu mengambang menampilkan daftar nilai px beserta jumlah M/P/G, dan pengguna dapat mengatur posisi menu agar tidak mengganggu tampilan halaman.
