Sebagian besar konten web adalah teks, sehingga tipografi menentukan kualitas baca sebuah halaman. Section ini membahas pemilihan font, ukuran dan bobot, line-height, perataan, hingga web fonts dan variable fonts beserta strategi responsive-nya.

# Font Family

Pilih keluarga huruf untuk halaman web dengan font-family, kenali generic families, dan bangun fallback stack yang aman.

Buka → # Font Size dan Font Weight

Atur ukuran huruf dengan px, rem, em, dan keyword, lalu kontrol ketebalan melalui skala font-weight 100 hingga 900.

Buka → # Line Height

Atur jarak antar baris teks dengan line-height, pahami tiga bentuk nilainya, dan pahami mengapa nilai unitless paling disarankan.

Buka → # Text Alignment

Sejajarkan teks secara horizontal dengan text-align, pelajari nilai start dan end, serta text-align-last untuk baris terakhir.

Buka → # Text Decoration

Tambahkan dan hias garis pada teks dengan text-decoration: line, color, style, dan thickness.

Buka → # Letter Spacing dan Word Spacing

Atur jarak antarhuruf dengan letter-spacing dan jarak antarkata dengan word-spacing, termasuk perilaku satuan em-nya.

Buka → # Web Fonts

Bawa font pilihan sendiri ke halaman web dengan @font-face, kenali font-display, dan pelajari strategi pemuatannya.

Buka → # Variable Fonts

Kenali variable fonts yang menyimpan banyak bobot dalam satu file, dan kendalikan sumbunya lewat font-weight, font-stretch, serta font-variation-settings.

Buka → # Text Wrapping

Kendalikan bagaimana teks melipat dengan white-space, overflow-wrap, word-break, hyphens, dan text-wrap: balance.

Buka → # Responsive Typography

Susun tipografi yang menyesuaikan ukuran layar dengan clamp(), skala tipografi berbasis rem, dan penghormatan atas preferensi pengguna.

Buka →