Como usar
- Defina o tamanho da fonte base (
html font-size) no campo correspondente. O padrão do navegador costuma ser 16px. - Digite um valor em pixels, como
24, no campo PX. - O campo REM exibirá instantaneamente o resultado de
1.5rem. Você também pode digitar um valor no campo REM (ex:2rem) para obter a conversão em pixels (32px). - Consulte a tabela abaixo para conferir rapidamente os espaçamentos, tamanhos de fonte padrão e as classes utilitárias do Tailwind.
Recursos principais
- Conversão bidirecional instantânea: Digite em PX ou REM e obtenha o valor oposto imediatamente, sem necessidade de clicar em botões de cálculo.
- Tamanho de fonte base customizável: Comece com o padrão de 16px ou mude para 10px, 14px ou qualquer outro valor de raiz configurado no seu projeto.
- Tabela de equivalências integrada: Tamanhos de fonte e espaçamentos comuns são atualizados automaticamente com base no tamanho de fonte base definido.
- Referência para Tailwind Spacing: Visualize de forma simples os tokens de espaçamento do Tailwind correspondentes aos valores em pixels informados.
- Seguro, leve e local: Todos os cálculos são realizados localmente na memória do seu navegador, funcionando perfeitamente sem requisições de rede.
Ferramentas relacionadas
Minifique ou formate seu código CSS localmente no seu navegador. Remova comentários e espaços em branco, visualize estatísticas de economia de tamanho ou desfaça a minificação. Processamento local no navegador, seguro e privado, sem upload.
Formatador JSON seguro: formate, valide e corrija JSON localmente no seu navegador. Embeleze, minifique, detecte erros e gere interfaces TypeScript ou Zod. Processamento local no navegador, seguro e privado, sem upload.
Testador e avaliador de JSONPath gratuito para JSON de API. Extraia nós correspondentes em tempo real, inspecione caminhos e copie resultados JSON com processamento local no navegador, seguro e privado (sem upload).
Converta objetos ou arrays JSON para CSV localmente no seu navegador. Aplane campos aninhados, visualize o resultado e copie ou baixe o arquivo CSV de forma segura e privada (sem upload de dados).
Converta texto ou arquivos CSV para JSON localmente no seu navegador. Suporte a cabeçalhos, delimitadores de vírgula/ponto e vírgula/tabulação, arquivos por arrastar e soltar. Processamento local no navegador, seguro e privado, sem upload.
Compare dois documentos JSON localmente no seu navegador. Ordene as chaves dos objetos para uma comparação semântica, ignore diferenças de ordenação e identifique campos adicionados, removidos ou modificados. Processamento local no navegador, seguro e privado, sem upload.
Minifique JSON em uma linha, remova recuos e quebras de linha, e compare o tamanho original, tamanho minificado, bytes economizados e porcentagem salva. Seguro e privado com processamento local no navegador (sem upload).
Conversor de JSON para TypeScript online e gratuito. Gere instantaneamente interfaces e tipos de TypeScript a partir do seu JSON com processamento local no navegador, seguro e privado (sem upload).
Lógica de cálculo
- Fórmula de PX para REM:
REM = PX / Base Size. - Fórmula de REM para PX:
PX = REM × Base Size. - Usando o tamanho de raiz padrão do navegador (16px), temos que
16px = 1reme24px = 1.5rem.
Perguntas frequentes
Quantos pixels equivalem a 1rem?
Na maioria dos navegadores, 1rem equivale a 16px por padrão. Se o seu projeto redefinir essa regra no CSS usando html { font-size }, insira o valor correspondente no campo de tamanho base.
Qual é a diferença entre PX e REM?
PX é uma unidade de pixel absoluta e fixa. REM é uma unidade relativa ao tamanho da fonte do elemento raiz (html), sendo ideal para layouts responsivos e acessibilidade, respeitando a configuração de tamanho de texto do usuário.
Por que alguns projetos usam a base de 10px?
Muitas equipes definem html { font-size: 62.5%; } no CSS para que 1rem seja equivalente a 10px. Isso facilita o cálculo mental dos desenvolvedores, mas deve ser usado com atenção aos recursos de acessibilidade do navegador.
A ferramenta também converte para EM?
Não. Esta calculadora foca nas unidades PX e REM. A unidade EM varia conforme o tamanho da fonte do próprio elemento pai ou do próprio elemento, não possuindo uma conversão linear e fixa como o REM em relação à raiz.
Minhas informações de estilo ou design são enviadas a servidores?
Não. Todas as conversões são feitas localmente na memória do seu navegador, sem qualquer envio de arquivos ou processamento externo.