Konverter Satuan CSS (px, rem, em, vw, pt…)
Ubah panjang CSS antara px, rem, em, %, vw, vh, vmin, vmax, pt, pc, in, cm, mm, dan Q dengan ukuran font root dan viewport Anda sendiri. Gratis dan instan.
1remSatuan absolut mengikuti CSS: 1in = 96px = 2,54cm = 72pt = 6pc, 1Q = 0,25mm. rem memakai ukuran font root; em dan % memakai ukuran font induk (seperti pada font-size); vw/vh/vmin/vmax memakai viewport. Hasil dibulatkan ke 4 desimal.
Apa itu Konverter Satuan CSS?
Ubah panjang CSS antara satuan absolut (px, pt, pc, in, cm, mm, Q) dan satuan relatif (rem, em, %, vw, vh, vmin, vmax). Atur ukuran font root, ukuran font induk, dan ukuran viewport agar satuan relatif dihitung sesuai konteks nyata Anda; semua satuan ditampilkan sekaligus.
Cara menggunakan Konverter Satuan CSS
- Masukkan Nilai dan pilih satuan Dari dan Ke.
- Sesuaikan Ukuran font root (px, untuk rem), Ukuran font induk (px, untuk em dan %), serta lebar dan tinggi viewport.
- Salin hasil utama atau klik kartu satuan mana pun untuk menyalin nilainya.
Contoh
24px (root 16px)
1.5rem · 18pt · 1.25vw (1920px viewport)
Kapan menggunakan Konverter Satuan CSS
Gunakan saat mengubah spesifikasi desain dalam px menjadi CSS berbasis rem, atau memeriksa arti nilai vw pada layar tertentu. % hanya setara dengan em untuk font-size; untuk width atau padding, % merujuk pada blok pembungkus, yang tidak dapat diketahui alat ini.
Cara kerja Konverter Satuan CSS
Semuanya dikonversi melalui piksel CSS. Satuan absolut memakai rasio CSS yang tetap: 1in = 96px = 2,54cm = 25,4mm = 72pt = 6pc, 1Q = 0,25mm. rem dikalikan ukuran font root, em dikalikan ukuran font induk, % adalah persentase dari ukuran font induk (interpretasi font-size), vw/vh adalah 1% dari lebar/tinggi viewport, dan vmin/vmax memakai sisi yang lebih kecil/besar. Hasil dibulatkan hingga 4 desimal.
Kasus Penggunaan Umum
- Mengonversi ukuran px dari design system menjadi rem
- Memeriksa seberapa besar 5vw pada laptop selebar 1440px
- Mengubah ukuran cetak dalam pt atau mm menjadi px CSS
- Menghitung nilai em untuk komponen dengan font induk 20px
Pertanyaan Umum
Mengapa 1rem sama dengan 16px?
Browser menetapkan ukuran font root bawaan 16px. Jika CSS Anda menyetel html { font-size: 62.5% }, masukkan 10 sebagai ukuran font root.
Apa beda rem dan em?
rem relatif terhadap ukuran font root (html); em relatif terhadap ukuran font elemen induk, sehingga berlipat saat bersarang.
Apakah cm dan in adalah ukuran fisik di layar?
Tidak. CSS menetapkan 1in = 96px, sehingga di sebagian besar layar sentimeter CSS tidak persis sentimeter sungguhan. Keduanya akurat saat dicetak.