Apa yang Dilakukan Alat Ini
Konverter px ke rem & em mengubah nilai piksel (px) menjadi rem dan em, atau sebaliknya. Anda cukup memasukkan angka pada salah satu dari tiga kolom unit — px, rem, atau em — dan alat ini langsung menghitung serta menampilkan nilai yang setara pada dua unit lainnya. Anda juga dapat mengatur ukuran font root sendiri dan ukuran font konteks em sendiri, sehingga hasil konversi sesuai dengan kebutuhan desain spesifik Anda.
Cara Memasukkan dan Mengonversi Nilai
Ada tiga kolom nilai yang saling terhubung: px, rem, dan em. Begitu Anda mengedit salah satu kolom, dua kolom lainnya diperbarui secara otomatis saat Anda mengetik — persis seperti keterangan pada halaman: "Masukkan nilai px, rem, atau em — dua nilai lainnya akan langsung diperbarui saat Anda mengetik." Anda tidak perlu menekan tombol konversi terpisah; begitu alat berhasil menghitung ketiga unit, statusnya berubah menjadi "Berhasil dikonversi di ketiga unit."
Alat ini juga menerima nilai piksel negatif, jadi Anda bisa memasukkan angka seperti -8 jika desain Anda memang membutuhkan nilai negatif, misalnya untuk margin negatif.
Menyesuaikan Ukuran Font Root
Kolom "Ukuran font root (px)" menentukan ukuran font dasar yang dipakai untuk menghitung nilai rem. Secara default, kolom ini terisi 16px, dan pada kondisi awal 16px sama dengan 1rem sama dengan 1em. Jika proyek Anda memakai ukuran font root yang berbeda, ubah angka pada kolom ini — semua nilai rem pada alat akan langsung dihitung ulang mengikuti basis baru tersebut. Kolom ini harus diisi angka yang lebih besar dari 0.
Sebagai contoh, jika ukuran font root diatur ke 16px, nilai 24px sama dengan 24 dibagi 16, yaitu 1,5rem. Jika Anda mengubah ukuran font root menjadi 20px, nilai 24px yang sama akan menjadi 24 dibagi 20, yaitu 1,2rem.
Menyesuaikan Ukuran Konteks Em
Kolom "Ukuran font konteks em (px)" berfungsi berbeda dari ukuran font root: kolom ini menentukan ukuran font elemen tempat nilai em tersebut akan diterapkan, agar konversi em Anda akurat untuk elemen itu. Nilainya juga default ke 16px dan harus diisi angka yang lebih besar dari 0.
Misalnya, jika sebuah judul pada halaman Anda memiliki ukuran font 20px dan Anda ingin tahu berapa em untuk jarak 30px di dalam judul tersebut, atur ukuran konteks em ke 20px — maka 30px akan sama dengan 30 dibagi 20, yaitu 1,5em.
Tabel Konversi Umum px ke rem
Di bawah kolom-kolom input, alat ini menampilkan tabel "Konversi umum px → rem (basis 16px)" yang berisi daftar nilai piksel umum beserta padanan rem-nya, dengan asumsi ukuran font root 16px. Tabel ini berguna sebagai referensi cepat ketika Anda ingin melihat beberapa nilai piksel sekaligus tanpa mengetikkan satu per satu ke kolom nilai.
Pesan Kesalahan yang Perlu Diperhatikan
Alat ini menampilkan pesan kesalahan yang berbeda tergantung kolom mana yang bermasalah:
- Jika Anda memasukkan nilai yang tidak valid pada kolom Nilai, muncul pesan "Masukkan angka untuk dikonversi."
- Jika ukuran font root yang Anda masukkan bukan angka lebih besar dari 0, muncul pesan "Ukuran font root harus berupa angka yang lebih besar dari 0."
- Jika ukuran font konteks em yang Anda masukkan bukan angka lebih besar dari 0, muncul pesan "Ukuran font konteks em harus berupa angka yang lebih besar dari 0."
Pesan-pesan ini membantu Anda mengenali dengan tepat kolom mana yang perlu diperbaiki sebelum konversi bisa berjalan lagi.
Privasi dan Pemrosesan Data
Setiap konversi yang Anda lakukan berjalan langsung di browser Anda sendiri. Tidak ada data yang Anda ketikkan ke dalam alat ini yang diunggah ke BroBroGo.
Pertanyaan yang Sering Diajukan
Apa yang terjadi jika saya mengubah ukuran font root setelah memasukkan nilai? Semua nilai rem pada alat dihitung ulang mengikuti ukuran font root yang baru saja Anda masukkan, selama angkanya lebih besar dari 0.
Kapan saya perlu mengubah ukuran konteks em, bukan hanya ukuran font root? Ubah ukuran konteks em saat Anda ingin mengonversi nilai em untuk elemen yang ukuran fontnya berbeda dari ukuran font root halaman — konteks em memakai ukuran font elemen itu sendiri, bukan ukuran font root.
Apakah saya bisa memasukkan nilai piksel negatif? Bisa. Alat ini menerima nilai piksel negatif dan tetap mengonversinya ke rem dan em yang sesuai.
Apa yang terjadi kalau saya salah mengetik di salah satu kolom? Alat akan menampilkan pesan kesalahan yang sesuai dengan kolom yang bermasalah, seperti "Masukkan angka untuk dikonversi." untuk kolom Nilai, sampai Anda memasukkan angka yang valid.