Tipografi

Skala adalah keputusan densitas dan jenis huruf adalah keputusan font: halaman ini menunjukkan apa yang dibaca bentuk, bukan apa nilainya hari ini. Alihkan sumbu font di panel debug dan semuanya di bawah diatur dalam jenis huruf lain tanpa mengubah aturan.

Keluarga

Tiga, karena itulah yang dibedakan oleh sebuah halaman: apa yang ditulis, apa yang diberi judul, dan apa yang dimaksudkan untuk dibaca sebagai yang diketik daripada yang diucapkan. Sebuah set dapat memberikan jenis huruf yang sama untuk ketiganya — yang dilakukan oleh sistem.

--font-family-base

Rubah coklat cepat melompati anjing malas — 0123456789

--font-family-heading

Rubah coklat cepat melompati anjing malas — 0123456789

--font-family-mono

Rubah coklat cepat melompati anjing malas — 0123456789

Berat

Dinamai berdasarkan seberapa banyak mereka menekankan, tidak pernah berdasarkan angka. Sebuah jenis huruf yang 500 tidak ada memetakan ke apa yang dimilikinya, dan bentuk yang meminta medium terus meminta medium.

--font-weight-normal — Rubah coklat cepat melompati anjing malas — 0123456789

--font-weight-medium — Rubah coklat cepat melompati anjing malas — 0123456789

--font-weight-strong — Rubah coklat cepat melompati anjing malas — 0123456789

--font-weight-bold — Rubah coklat cepat melompati anjing malas — 0123456789

Skala jenis

Sistem Desain — Blok bangunan untuk antarmuka yang hebat

Digunakan sekali per halaman. Menetapkan konteks utama. Dipasangkan dengan paragraf pembuka yang singkat.

Tipografi menetapkan hierarki dan ritme

Judul level bagian. Mengelompokkan konten terkait. Biasanya diikuti oleh teks utama atau sub-bagian.

Jarak dan proporsi membentuk keterbacaan

Judul sub-bagian. Memperkenalkan topik yang terfokus dalam sebuah bagian.

Warna dan kontras membimbing mata

Digunakan untuk judul kartu, bagian sidebar, atau pengelompokan kecil.

Status interaktif perlu jelas

Label, header metadata, pengelompokan kecil. Halus tetapi berbeda dari teks utama.

Aksesibilitas adalah fitur, bukan pemikiran setelahnya

Tingkat judul terkecil. Gunakan dengan hemat — untuk catatan kaki, blok hukum, atau label tambahan.