Scala tipografica e interlinea, anche su griglia di base

Calcola corpi del testo armonici a partire dal corpo base e da un rapporto, con l'interlinea per ciascuno, arrotondata alla griglia di base se vuoi, ed esporta i valori come CSS.

Corpo baseUnitàRapporto

Gradi sottoGradi sopraInterlinea (× corpo)

Griglia di base

Grado	Corpo	Interlinea
5	30,52 pt	42,72 pt
4	24,41 pt	34,18 pt
3	19,53 pt	27,34 pt
2	15,63 pt	21,88 pt
1	12,50 pt	17,50 pt
0	10,00 pt	14,00 pt
-1	8,00 pt	11,20 pt
-2	6,40 pt	8,96 pt

Griglia e ritmo

Valori CSS

:root {
  --step-5: 30.52pt;
  --leading-5: 42.72pt;
  --step-4: 24.41pt;
  --leading-4: 34.18pt;
  --step-3: 19.53pt;
  --leading-3: 27.34pt;
  --step-2: 15.63pt;
  --leading-2: 21.88pt;
  --step-1: 12.5pt;
  --leading-1: 17.5pt;
  --step-0: 10pt;
  --leading-0: 14pt;
  --step-m1: 8pt;
  --leading-m1: 11.2pt;
  --step-m2: 6.4pt;
  --leading-m2: 8.96pt;
}

Come funziona

Ogni grado della scala è il precedente moltiplicato per il rapporto: corpo = corpo base × rapporto^grado. I gradi negativi danno corpi più piccoli, per note e didascalie.

I rapporti sono indicati con il loro valore esatto, per esempio 5:4 = 1,25 o φ = (1 + √5) / 2 ≈ 1,618. Puoi anche inserire un rapporto qualsiasi maggiore di 1.

L'interlinea è il corpo moltiplicato per il fattore scelto. Con la griglia di base ogni interlinea è arrotondata per eccesso a un numero intero di linee, così tutti i testi restano sulla griglia. Il link porta al generatore di griglie con questa griglia di base.

Fonti

CSS Values and Units Module Level 3, absolute lengths (1pt = 1/72 in, 1px = 1/96 in), World Wide Web Consortium (W3C) (consultato il 20 ottobre 2026)