Typografische Schaal Generator
Bouw een modulaire typografische schaal op basis van een basisgrootte en verhouding — live voorbeeld, px/rem-tabel en kant-en-klare CSS-variabelen.
606 weergaven
Waarom een modulaire schaal
In plaats van kopgroottes op het oog te kiezen, vermenigvuldigt een modulaire schaal een basisgrootte met een vaste verhouding per stap: basis 16 px met een verhouding van 1,25 (grote terts) geeft 20, 25, 31,3, 39,1, 48,8... De groottes verhouden zich als muzikale intervallen, en de hele hiërarchie blijft consistent — verander de basis of de verhouding en alles wordt samen opnieuw gestemd.
Veelgebruikte verhoudingen: 1,125 (grote secunde — compacte UI), 1,25 (grote terts — de veilige standaard), 1,333 (reine kwart — redactioneel), 1,618 (gulden snede — dramatisch, weinig niveaus nodig). De gegenereerde CSS custom properties plakt u direct in uw stylesheet; rem-waarden gaan uit van een 16-px-root.
Veelgestelde vragen
Welke verhouding moet ik kiezen?
Product-/UI-werk zit meestal op 1,125-1,25 (koppen niet veel groter dan lopende tekst); marketing- en redactionele pagina's dragen 1,333-1,618 goed. Voelt de h1 schreeuwerig, verlaag dan de verhouding met een stap in plaats van één grootte handmatig aan te passen.
Waarom gaat de schaal onder de basis?
Negatieve stappen (basis ÷ verhouding) geven bijschriften en kleine lettertjes die bij hetzelfde systeem horen — 12,8 px bij een 16/1,25-schaal in plaats van een willekeurige 13.
Moet ik px of rem gebruiken?
rem in de CSS: gebruikers die hun browserlettergrootte verhogen, krijgen een proportioneel grotere schaal. De px-kolom is bedoeld voor mockups in ontwerptools.
Vergelijkbare tools
Probleem melden
Typografische Schaal Generator