Da px a rem e interlinea
- I file non lasciano il dispositivo
- Funziona nel browser
- Gratis, senza account, senza filigrana
Converter
Type in any box, the rest follow.Preview
Typography is the craft of making language visible. A good line length and generous leading let the eye glide from one line to the next without losing its place.
Common sizes
Click a row to load it into the converter.| px | rem | em | pt | vw | Line-height |
|---|---|---|---|---|---|
| 10 | 0.625 | 0.625 | 7.5 | 0.694 | 1.7 |
| 12 | 0.75 | 0.75 | 9 | 0.833 | 1.65 |
| 13 | 0.8125 | 0.8125 | 9.75 | 0.903 | 1.63 |
| 14 | 0.875 | 0.875 | 10.5 | 0.972 | 1.6 |
| 15 | 0.9375 | 0.9375 | 11.25 | 1.042 | 1.57 |
| 16 | 1 | 1 | 12 | 1.111 | 1.55 |
| 18 | 1.125 | 1.125 | 13.5 | 1.25 | 1.52 |
| 20 | 1.25 | 1.25 | 15 | 1.389 | 1.5 |
| 24 | 1.5 | 1.5 | 18 | 1.667 | 1.4 |
| 28 | 1.75 | 1.75 | 21 | 1.944 | 1.32 |
| 32 | 2 | 2 | 24 | 2.222 | 1.25 |
| 36 | 2.25 | 2.25 | 27 | 2.5 | 1.23 |
| 40 | 2.5 | 2.5 | 30 | 2.778 | 1.2 |
| 48 | 3 | 3 | 36 | 3.333 | 1.15 |
| 56 | 3.5 | 3.5 | 42 | 3.889 | 1.13 |
| 64 | 4 | 4 | 48 | 4.444 | 1.1 |
| 72 | 4.5 | 4.5 | 54 | 5 | 1.09 |
| 96 | 6 | 6 | 72 | 6.667 | 1.05 |
Type scale
Fluid type with clamp()
Text grows smoothly between two viewport widths and stays fixed outside them.
font-size: clamp(1rem, 0.8239rem + 0.7512vw, 1.5rem);
The quick brown fox
Come usare Da px a rem e interlinea
Converti tra px, rem, em, pt, % e vw usando le tue dimensioni di font radice e genitore e ottieni un'interlinea e una lunghezza di riga consigliate per qualsiasi dimensione. La pagina costruisce anche una scala tipografica modulare e una regola clamp() fluida per il testo responsive.
- 1
Imposta Dimensione del font radice, Dimensione del font genitore e Larghezza del viewport sotto Contesto.
- 2
Digita un valore in qualsiasi casella del Convertitore; le altre unità seguono.
- 3
Leggi l'Interlinea consigliata e la Lunghezza di riga comoda per quella dimensione.
- 4
Facoltativo: costruisci una Scala tipografica da un rapporto, oppure un Tipo fluido con regola clamp(), e copia il CSS.
Domande frequenti
Quanti pixel è 1rem?
1rem equivale alla dimensione del font radice (<html>), che i browser impostano a 16 px per impostazione predefinita. Cambia Dimensione del font radice se il sito usa una base diversa.
Qual è la differenza tra rem ed em?
rem è relativo alla dimensione del font radice; em e % sono relativi alla dimensione del font dell'elemento genitore. Imposta Dimensione del font genitore per convertire em correttamente.
Come viene scelta l'interlinea?
Segue la pratica tipografica comune: circa 1,5 per il testo del corpo e un'interlinea più stretta per i titoli grandi. Viene mostrata anche una versione agganciata a una griglia di 4 px.
Cosa fa il generatore clamp()?
Scrive un font-size che cresce in modo fluido tra una dimensione minima e una massima su due larghezze di viewport e resta fisso fuori da esse. Simula la larghezza del viewport mostra il risultato a qualsiasi larghezza.
Posso convertire i punti per la stampa?
Sì. pt usa il rapporto CSS di 72 pt su 96 px, quindi 12 pt equivalgono a 16 px.