Yazı Tipi Boyut Ölçeği

Bu araç ne işe yarar?

Yazı Tipi Boyut Ölçeği aracı, seçtiğiniz temel boyut ve modüler ölçek oranından tutarlı bir tipografi skalası üretir ve bunu kopyalanabilir CSS değişkenlerine dönüştürür. Tasarımcılar ve geliştiriciler için, başlık ve gövde metinleri arasında matematiksel olarak uyumlu boyut hiyerarşisi kurmanın hızlı bir yoludur.

Nasıl kullanılır?

Değerleri ve seçenekleri ayarlayın.
Canlı önizlemede sonucu görün.
Üretilen CSS/kodu projenize kopyalayın.

Modüler ölçek nasıl çalışır?

Her adım, temel boyutun ölçek oranına göre üssel olarak büyütülmesiyle hesaplanır: bir üst adım temel boyut çarpı oran, bir sonraki bunun tekrar çarpımıdır. Araç xs'ten 3xl'e kadar sekiz adım üretir; ölçek olarak Minor Second (1.067), Major Third (1.250), Perfect Fourth (1.333) veya Altın Oran (1.618) gibi sekiz klasik oran arasından seçim yaparsınız. 16px temel ve 1.250 oranıyla gövde 16px, bir alt başlık 20px, başlık 25px olur.

px ve rem çıktısı

px/rem düğmesiyle çıktı birimini değiştirebilirsiniz. rem değerleri 16px köke göre hesaplanır, yani 24px = 1.5rem. Üretilen :root bloğunu kopyalayıp stil dosyanıza yapıştırın; ardından --font-lg veya --font-2xl gibi değişkenleri doğrudan font-size içinde kullanın. Erişilebilirlik açısından rem önerilir, çünkü kullanıcının tarayıcı yazı boyutu ayarına saygı gösterir.

Sıkça sorulan sorular

Hangi ölçek oranını seçmeliyim?

Yoğun arayüzler için 1.125–1.200 gibi düşük oranlar daha sıkı bir hiyerarşi verir; açılış sayfaları ve büyük başlıklar için 1.414 veya Altın Oran (1.618) gibi yüksek oranlar daha dramatik bir kontrast oluşturur.

Çıktıdaki --font-base ne anlama geliyor?

base, ölçeğin merkez adımıdır ve girdiğiniz temel boyuta eşittir. xs ve sm ondan küçük, md'den 3xl'e kadar olan adımlar ise oran katları kadar büyüktür.