Conterver PX em REM

Para transformar valores em pixel (px) para rem, você deve dividir o valor em pixel por 16, o resultado será o valor em rem.

A divisão por 16 é feito pois, 1 rem é igual a 16 pixel, mais abaixo temos uma tabela onde listamos alguns valores em pixels convertidos em rem.

O formato rem é relativo, ou seja, ele se adapta aos diferentes tamanhos de fonte com base no padrão do navegador, é como se ele fosse calculado como percentual (%) em relação ao pixel, não é necessariamente assim, mas para tornar a explicação mais compreensível digamos que, você ganha 100 reais e guarda 10%, logo, você guarda 10 reais, se você passar a guanhar 200 e continuar guardando 10% você estará guardando 20 reais, isto porque o percentual esta ligado relativamente ao valor principal.

Nesta lógica de dinheiro acima agora aplicada a pixel seria:

• Total 100, pedaço 10
• Total 200, pedaço 10

Mas quando aplicamos o rem, fica:

• Total 100, pedaço 10
• Total 200, pedaço 20

É algo que acompanha o tamanho total.

Por padrão, os navegadores utilizam 16px, o que em rem é 1rem, mas o usuário pode alterar isto.

Vamos fazer um passo a passo de como você pode alterar ai em seu navegador o padrão e observar como o tamanho do texto fica diferente, primeiro, vamos criar duas frases, uma com tamanho em pixel e outra em rem:

Este texto esta com uma fonte de 16px.

Este texto esta com uma fonte de 1rem.

Se o seu navegador estiver com o padrão "de fábrica", você não notará nenhuma diferença no texto, mas vamos a mágica agora:

Usando o Google Chrome, vá em Personalizar (três pontinhos no canto superior direito), acione a opção  Configurações, em seguinda, na tela que abrir, escoha Aparência, após, Personalizar Fontes, em Tamanho da Fonte, aumente ela para 26, por exemplo, feito isto, volte aqui e veja como os textos acima estão com tamanhos diferentes.