Conversor de PX para REM

O padrão do navegador é 16px.

O que é Conversor de PX para REM

Um conversor de px para rem traduz um tamanho CSS entre pixels e unidades rem. Um rem equivale ao tamanho da fonte raiz da página, que os navegadores definem como 16px por padrão, então 16px é 1rem e 24px é 1,5rem. Digite um valor em qualquer campo e o outro se atualiza na hora. Altere a caixa do tamanho da fonte raiz se o seu projeto usa uma base diferente (um truque comum é definir a raiz como 62,5% para que 10px seja igual a 1rem).

Como usar

  1. Defina o tamanho da fonte raiz se o seu projeto difere do padrão de 16px.
  2. Digite um valor em pixels no campo Pixels para ver o equivalente em rem.
  3. Ou digite um valor em rem no campo REM para ver o equivalente em pixels.
  4. Copie qualquer resultado com o ícone de copiar ao lado do campo.
  5. Clique em Limpar para redefinir os campos e iniciar uma nova conversão.

Quando usar

Está montando um layout responsivo e precisa do seu título de 24px em rem? Digite 24 e você recebe 1,5rem, pronto para colar na sua folha de estilo. Trocar um design de pixels fixos para rem escalável mantém o texto e os espaçamentos em sintonia com a configuração do navegador do leitor, então quem aumenta o tamanho de fonte padrão vê todo o layout crescer junto em vez de ficar travado nos seus valores em pixel.

Perguntas frequentes

Como converto px para rem?

Divida o valor em pixels pelo tamanho da fonte raiz. Com a raiz padrão de 16px, 24px é 24 / 16 = 1,5rem, e 8px é 8 / 16 = 0,5rem. Para fazer o inverso, multiplique o valor em rem pelo tamanho da fonte raiz: 1,25rem numa raiz de 16px é 1,25 * 16 = 20px.

Qual é o tamanho de fonte raiz padrão?

Os navegadores usam 16px como tamanho de fonte raiz padrão, então esta ferramenta começa por aí. Se o seu CSS altera o font-size do elemento html (por exemplo para 62,5%, o que torna a raiz 10px), atualize a caixa do tamanho da fonte raiz para que a conversão corresponda ao seu projeto.

Por que usar rem em vez de px no CSS?

As unidades rem escalam com o tamanho da fonte raiz, que respeita o tamanho que o leitor escolheu nas configurações do navegador. Dimensionar fontes, margens e espaçamentos em rem permite que todo o layout cresça ou diminua com essa preferência, o que é melhor para a acessibilidade do que pixels que ficam fixos.

Posso compartilhar esta ferramenta com meus dados preenchidos?

Sim. A URL é atualizada automaticamente enquanto você digita. Copie da barra de endereço ou use o botão Compartilhar, quem abrir verá seus dados exatos já preenchidos.

Ferramentas relacionadas