Generator Skala Tipe
Buat skala tipe modular untuk desain Anda. Pilih ukuran dasar dan rasio untuk membuat ukuran heading yang proporsional sempurna.
Apa itu skala tipe modular?
Skala tipe modular adalah sekumpulan ukuran font yang mengikuti rasio matematika yang konsisten - misalnya Major Third (1,25x) atau Perfect Fourth (1,333x). Alih-alih memilih ukuran secara sembarangan, setiap heading dari h1 hingga h6 secara proporsional lebih besar dari yang di bawahnya. Hasilnya adalah tipografi yang terasa harmonis dan seimbang secara visual.
Cara memilih rasio yang tepat
Rasio lebih kecil seperti Minor Second (1,067) atau Major Second (1,125) menciptakan skala halus dan kompak - baik untuk UI yang padat. Rasio lebih besar seperti Perfect Fourth (1,333) atau Golden Ratio (1,618) menciptakan kontras dramatis - ideal untuk situs editorial. Major Third (1,25) adalah default yang aman yang bekerja baik di sebagian besar ukuran layar.
Menggunakan CSS yang dihasilkan
Panel Generated CSS menghasilkan properti kustom CSS dalam :root (mis. --text-h1) dan selektor langsung untuk setiap level heading. Salin dan tempel ke stylesheet Anda. Gunakan toggle rem untuk ukuran yang fluid dan aksesibel yang menyesuaikan dengan preferensi font browser, atau px jika desain Anda membutuhkan ukuran tetap.
Skala tipe dan aksesibilitas
Menggunakan satuan rem alih-alih px membuat tipografi Anda menyesuaikan dengan preferensi ukuran font sistem pengguna, yang merupakan pertimbangan aksesibilitas penting. WCAG merekomendasikan agar teks dapat diubah ukurannya hingga 200% tanpa kehilangan konten atau fungsionalitas. Skala tipe yang terstruktur dengan baik dikombinasikan dengan satuan rem memenuhi persyaratan ini secara otomatis.