Generatore di Scala Tipografica
Il generatore di scala tipografica calcola una scala modulare partendo da una dimensione del font base e da un rapporto, da Minor Second (1.067) alla sezione aurea (1.618), e restituisce nove dimensioni come proprietà personalizzate CSS.
Informazioni su questo strumento
Il generatore di scala tipografica calcola una scala modulare partendo da una dimensione del font base e da un rapporto, da Minor Second (1.067) alla sezione aurea (1.618), e restituisce nove dimensioni come proprietà personalizzate CSS.
Come si usa
- Inserisci una dimensione del font base in pixel (16 px è il valore predefinito del browser).
- Scegli un rapporto di scala, per esempio Major Third (1.25).
- Scegli l'unità di output: rem, px o em.
- Clicca Copy CSS Variables per usare le dimensioni da --xs a --4xl.
Da sapere
- Ogni passaggio di una scala modulare moltiplica la dimensione precedente per lo stesso rapporto.
- Il generatore produce nove passaggi: due sotto la base, la base e sei sopra.
- I rapporti più piccoli (1.067–1.2) si adattano a interfacce dense; quelli più grandi (1.333–1.618) a pagine editoriali con titoli grandi.
- I valori rem sono calcolati rispetto a una dimensione del font radice di 16 px.
- Usare rem permette al testo di adattarsi all'impostazione della dimensione del font nel browser dell'utente.
Funziona interamente nel tuo browser: nulla di ciò che inserisci viene caricato o salvato.
Domande frequenti
Cos'è una scala tipografica modulare?
È un insieme di dimensioni del font in cui ogni dimensione è la precedente moltiplicata per un rapporto fisso, così titoli e testo restano visivamente coerenti.
Quale rapporto di scala dovrei usare?
Major Third (1.25) e Perfect Fourth (1.333) sono scelte versatili molto diffuse. Usa un rapporto più piccolo per app e dashboard e uno più grande per landing page e blog.
Le dimensioni dei font vanno in rem o px?
In genere si consiglia rem, perché rispetta la dimensione del font preferita dall'utente nel browser, migliorando l'accessibilità.
Quale dimensione del font base dovrei usare?
16 px è il valore predefinito standard dei browser e una buona base per il testo; molti siti usano 16–18 px per una lettura confortevole.