Renk dönüştürücü
Saydamlıkla birlikte HEX, RGB ve HSL dönüştürün, renk örneğini görün ve CSS değerlerini kopyalayın.
CSS clamp ile akışkan yazı boyutu
Yazı boyutu ve görüntü alanı sınırlarından px veya rem kullanan uyumlu bir font-size: clamp() ifadesi oluşturun.
rem, belirttiğiniz kök boyutuna göre hesaplanır. Son tasarımda tarayıcı yakınlaştırmasını ve büyük metin ayarlarını da kontrol edin.
Doğru yazı boyutu, her cümleyi daha rahat okunur kılar.
CSS
Araç hakkında
Telefon ve bilgisayar başlık boyutlarını belirleyip ara değerlerini inceleyebilirsiniz.
Nasıl kullanılır
En küçük ve en büyük yazı boyutlarını, bunlara karşılık gelen görüntü alanı genişlikleriyle birlikte girin. px veya rem seçin, benzetilen genişliği değiştirip hesaplanan boyutu görün ve CSS’yi alın. Genişlikler küçükten büyüğe olmalı; en küçük yazı boyutu en büyüğü aşmamalıdır.
Yazı belirtilen genişlikler arasında doğrusal değişir, aralık dışında boyut sınırlarını korur. rem kullanırken kök yazı boyutunu hedef sayfaya göre ayarlayın. Formül kapsayıcıya değil görüntü alanı genişliğine dayanır ve diğer tipografi ayarlarını değiştirmez.
Sık sorulan sorular
rem için kök boyutu neden gerekli?
Önizleme rem değerini piksele çevirmek için kök öğenin yazı boyutunu kullanır; bu değer sayfanızla eşleşmelidir. Formül tarayıcının görünüm alanı genişliğine göre değişir. Farklı kök yazı boyutu sonucu etkiler.
Telefonda 16px, masaüstünde 32px için hangi değerleri girmeliyim?
400px görünüm alanında 16px, 1200px görünüm alanında 32px istiyorsanız px birimini seçip bu iki genişlik-boyut çiftini girin. Sonuç clamp(16px, 8px + 2vw, 32px) olur: 800px genişlikte 24px verir, aralığın dışında alt ve üst sınırda kalır. Hesap kapsayıcının değil, görünüm alanının genişliğine bağlıdır.
İlgili araçlar
Yeni sekmede açılır
Yorumlar
0