Fondasi Desain
Tipografi
Tiga keluarga font, skala 9 langkah, dan aturan keterbacaan untuk portal publik.
Tipografi Majalengka Design System memprioritaskan keterbacaan tinggi di berbagai jenis layar ponsel, terutama bagi warga berusia lanjut.
Pilihan Huruf
| Peran | Font Family | Alasan Pemilihan |
|---|---|---|
| Judul / Heading | Plus Jakarta Sans | Dibuat oleh desainer Indonesia, berkarakter tegas, modern, dan memiliki bobot tebal 700–800 yang sangat kokoh. |
| Teks Isi / Paragraf | Inter | Sangat terbaca pada ukuran kecil (12–14px), mendukung rendering teks yang jernih di layar beresolusi rendah, serta mendukung angka tabular. |
| Monospace / Kode | JetBrains Mono | Digunakan khusus untuk nomor NIK, kode permohonan, token verifikasi, dan kutipan teknis. |
Semua font wajib di-self-host. Jangan menggunakan link CDN eksternal (Google Fonts) di server produksi pemerintah karena pembatasan firewall lokal di banyak instansi dan kantor kecamatan.
Skala Ukuran Tipografi
| Token | Ukuran | Line Height | Contoh Pemakaian |
|---|---|---|---|
text-xs | 12px | 1.5 | Label footer, keterangan gambar, badge status |
text-sm | 14px | 1.55 | Teks bantuan form, metadata, isi tabel |
text-base | 16px | 1.7 | Teks paragraf utama (dilarang lebih kecil untuk teks bacaan) |
text-lg | 18px | 1.65 | Paragraf pembuka / lead text |
text-xl | 20px | 1.5 | Judul kartu layanan |
text-2xl | 24px | 1.35 | Heading 3 |
text-3xl | 30px | 1.3 | Heading 2 |
text-4xl | 36px | 1.22 | Heading 1 halaman dalam |
text-5xl | 48px | 1.15 | Judul hero halaman beranda |
Aturan Keterbacaan Warga
- Lebar Baris Maksimal 68 Karakter (
max-width: 68ch) — Baris kalimat yang terlalu panjang membuat mata lelah dan sulit berpindah baris. - Angka Tabular (
font-variant-numeric: tabular-nums) — Semua kolom angka pada tabel dan daftar tagihan wajib menggunakan angka berlebar seragam agar digit sejajar rapi secara vertikal. - Larangan Teks Rata Kanan-Kiri (Justify) — Hindari perataan justify pada web karena memunculkan celah spasi tak beraturan ("sungai putih") yang menyulitkan pembaca difabel dan disleksia.