Referensi Satuan CSS

Referensi satuan CSS px, em, rem, %, vw, vh, vmin, vmax, dan ch yang tersusun per kategori. Dengan penjelasan jelas kapan memakai tiap satuan absolut dan relatif, gratis.

Unit	Nama	Tipe	Deskripsi	Contoh
px	Pixels	absolute	Satu piksel di layar. Unit paling dasar.	font-size: 16px;
em	Em	relative	Kelipatan font-size elemen induk.	padding: 1.5em;
rem	Root Em	relative	Kelipatan font-size elemen root (html).	margin: 2rem;
%	Percent	relative	Persentase relatif terhadap properti induk terkait.	width: 50%;
vw	Viewport Width	viewport	1% dari lebar viewport.	width: 100vw;
vh	Viewport Height	viewport	1% dari tinggi viewport.	height: 100vh;
vmin	Viewport Min	viewport	1% dari nilai terkecil antara vw dan vh.	font-size: 5vmin;
vmax	Viewport Max	viewport	1% dari nilai terbesar antara vw dan vh.	width: 50vmax;
dvh	Dynamic VH	viewport	Tinggi viewport dinamis (memperhitungkan bilah alamat seluler).	height: 100dvh;
svh	Small VH	viewport	Tinggi viewport terkecil.	min-height: 100svh;
lvh	Large VH	viewport	Tinggi viewport terbesar.	max-height: 100lvh;
ch	Character	relative	Berdasarkan lebar karakter "0".	max-width: 60ch;
ex	X-Height	relative	Berdasarkan tinggi karakter "x".	line-height: 2ex;
cm	Centimeters	absolute	Sentimeter. Untuk cetak.	width: 10cm;
mm	Millimeters	absolute	Milimeter. Untuk cetak.	margin: 5mm;
in	Inches	absolute	Inci (1in = 96px).	width: 2in;
pt	Points	absolute	Poin (1pt = 1/72in).	font-size: 12pt;
cqi	Container Inline	container	1% dari ukuran inline kontainer.	font-size: 5cqi;
cqb	Container Block	container	1% dari ukuran block kontainer.	padding: 2cqb;

19개 표시 중

Sematkan

<iframe src="https://devtools.patrache.studio/id/references/css-units/?embed=1" width="100%" height="620"
  style="border:1px solid #e5e7eb;border-radius:12px" loading="lazy"
  title="Referensi Satuan CSS — Patrache Studio DevTools"></iframe>
<p><a href="https://devtools.patrache.studio/id/references/css-units/">Referensi Satuan CSS</a> by
   <a href="https://patrache.studio/">Patrache Studio</a></p>

Terakhir diperbarui: 2026 · Alat online gratis

Apa itu Referensi Satuan CSS?

Referensi satuan CSS px, em, rem, %, vw, vh, vmin, vmax, dan ch yang tersusun per kategori. Dengan penjelasan jelas kapan memakai tiap satuan absolut dan relatif, gratis.

Cara Penggunaan

1
Input— Masukkan data yang diperlukan.
2
Hasil— Tinjau hasil yang diproses.
3
Salin— Salin hasil untuk digunakan.

Alat Terkait

Konverter PX-REMKonverter PX ke REM yang mengubah piksel dan rem dua arah memakai ukuran font root yang bisa disetel, termasuk nilai desimal. Dilengkapi tabel referensi dan cuplikan CSS.

Pemeriksaan Kompatibilitas BrowserKompatibilitas browser untuk fitur CSS, JavaScript, HTML, atau Web API apa pun: versi Chrome, Firefox, Safari, dan Edge mana yang mendukungnya. Gratis dan instan di browser.

Generator Gradien CSSGenerator gradien CSS visual untuk gradien linear, radial, dan conic: tambah color stop, atur sudut, lalu salin CSS-nya. Cocok untuk latar dan tombol, gratis di browser.

Generator CSS Box ShadowGenerator box-shadow CSS dengan kontrol offset, blur, spread, warna, dan inset serta pratinjau bayangan langsung. Salin kode CSS siap pakai untuk elemen apa pun, gratis.

Pertanyaan yang Sering Diajukan

Referensi satuan CSS gratis mencakup semua satuan panjang, sudut, dan waktu.

Tidak. Semua pemrosesan dilakukan di browser Anda.

Ya, desain responsif berfungsi di perangkat seluler.