Convertitore PX in REM

Il valore predefinito del browser è 16px.

Cos'è Convertitore PX in REM

Un convertitore px in rem traduce una dimensione CSS tra pixel e unità rem. Un rem equivale alla dimensione del font radice della pagina, che i browser impostano a 16px per impostazione predefinita, quindi 16px è 1rem e 24px è 1,5rem. Digita un valore in uno dei campi e l'altro si aggiorna in tempo reale. Modifica la casella della dimensione del font radice se il tuo progetto usa una base diversa (un trucco comune è impostare la radice al 62,5% così 10px equivale a 1rem).

Come usare

  1. Imposta la dimensione del font radice se il tuo progetto differisce dal valore predefinito di 16px.
  2. Digita un valore in pixel nel campo Pixel per vedere l'equivalente in rem.
  3. Oppure digita un valore in rem nel campo REM per vedere l'equivalente in pixel.
  4. Copia qualsiasi risultato con l'icona di copia accanto al campo.
  5. Clicca su Cancella per azzerare i campi e iniziare una nuova conversione.

Quando usarlo

Stai costruendo un layout responsive e ti serve il titolo da 24px in rem? Digita 24 e ottieni 1,5rem, pronto da incollare nel tuo foglio di stile. Passare un design da pixel fissi a rem scalabili mantiene testo e spaziature in sintonia con l'impostazione del browser del lettore, così chi aumenta la propria dimensione del carattere predefinita vede tutto il layout crescere insieme invece di restare bloccato sui tuoi valori in pixel.

Domande frequenti

Come converto px in rem?

Dividi il valore in pixel per la dimensione del font radice. Con la radice predefinita di 16px, 24px è 24 / 16 = 1,5rem e 8px è 8 / 16 = 0,5rem. Per fare il contrario, moltiplica il valore in rem per la dimensione del font radice: 1,25rem su una radice di 16px è 1,25 * 16 = 20px.

Qual è la dimensione del font radice predefinita?

I browser usano 16px come dimensione del font radice predefinita, quindi questo strumento parte da lì. Se il tuo CSS cambia il font-size dell'elemento html (ad esempio al 62,5%, che porta la radice a 10px), aggiorna la casella della dimensione del font radice così la conversione corrisponde al tuo progetto.

Perché usare rem invece di px in CSS?

Le unità rem si scalano con la dimensione del font radice, che rispetta la dimensione scelta dal lettore nelle impostazioni del browser. Dimensionare font, margini e spaziature in rem permette a tutto il layout di crescere o ridursi con quella preferenza, cosa migliore per l'accessibilità rispetto ai pixel fissi.

Posso condividere questo strumento con i miei dati precompilati?

Sì. L'URL si aggiorna automaticamente mentre digiti. Copia il link dalla barra degli indirizzi o usa il pulsante Condividi, chiunque lo apra vedrà i tuoi dati già inseriti.

Strumenti correlati