Fluid Type Scale Generator

Dieser Generator erstellt eine komplette Typografie-Skala auf Basis eines Design-System Ratios – optional mit clamp() Fluid Scaling.

Du kannst wählen:

  • klassische rem-Skala
  • oder fluid skalierte clamp()-Typografie

Basierend auf einem 62.5%-Root-System (1rem = 10px statt 16px).

Warum 10px Root Font Size?

Browser verwenden standardmässig eine Root Font Size von 16px.Viele moderne Design-Systeme setzen jedoch auf ein sogenanntes 62.5%-System.

Dabei wird im HTML-Element folgende Basis gesetzt:
html {font-size: 62.5%;}

Da 62.5% von 16px genau 10px entsprechen, gilt anschliessend 1rem = 10px.
Dadurch lassen sich rem-Werte deutlich einfacher berechnen: