Conversor de Pixel para REM
Converta entre px e rem/em. Defina seu tamanho de fonte raiz e obtenha uma tabela de conversão instantânea para todos os tamanhos comuns.
px
Convert
px
rem
Conversion Table (root = 16px)
| px | rem | em | pt | |
|---|---|---|---|---|
| 4 | 0.25rem | 0.25em | 3pt | |
| 8 | 0.5rem | 0.5em | 6pt | |
| 10 | 0.625rem | 0.625em | 7.5pt | |
| 12 | 0.75rem | 0.75em | 9pt | |
| 14 | 0.875rem | 0.875em | 10.5pt | |
| 16 | 1rem | 1em | 12pt | |
| 18 | 1.125rem | 1.125em | 13.5pt | |
| 20 | 1.25rem | 1.25em | 15pt | |
| 24 | 1.5rem | 1.5em | 18pt | |
| 28 | 1.75rem | 1.75em | 21pt | |
| 32 | 2rem | 2em | 24pt | |
| 36 | 2.25rem | 2.25em | 27pt | |
| 40 | 2.5rem | 2.5em | 30pt | |
| 48 | 3rem | 3em | 36pt | |
| 56 | 3.5rem | 3.5em | 42pt | |
| 64 | 4rem | 4em | 48pt | |
| 72 | 4.5rem | 4.5em | 54pt | |
| 80 | 5rem | 5em | 60pt | |
| 96 | 6rem | 6em | 72pt | |
| 112 | 7rem | 7em | 84pt | |
| 128 | 8rem | 8em | 96pt |
Como Usar Conversor de Pixel para REM
- 1Defina seu tamanho de fonte raiz (padrão 16px).
- 2Digite um valor em pixel para converter para rem/em.
- 3Veja a tabela de conversão completa para tamanhos comuns.
- 4Copie qualquer valor diretamente da tabela.
ZenovayAnalytics
Analytics feito para fundadores.
- Acompanhamento de visitantes em tempo real
- Privacidade em primeiro lugar, sem banner de cookies
- Configurado em dois minutos
Ferramentas Relacionadas
Formatador e Validador de JSON
Formate, valide e embeleze dados JSON com destaque de sintaxe e detecção de erros.Decodificador JWT
Decodifique e inspecione tokens JWT. Visualize cabeçalho, payload e verifique assinaturas.Codificar/Decodificar Base64
Codifique texto para Base64 ou decodifique Base64 de volta para texto. Suporta dados UTF-8 e binários.Encode/Decode de URL
Codifique ou decodifique componentes de URL. Trate caracteres especiais, strings de consulta e URLs completas.Perguntas Frequentes
Qual é a diferença entre px, rem e em?▾
px (pixels) é uma unidade absoluta — 1px é sempre 1 pixel independente de dispositivo, independentemente do contexto. rem (root em) é relativo ao tamanho de fonte do elemento raiz (<html>). Se a raiz é 16px, então 1rem = 16px, 2rem = 32px. em é relativo ao tamanho de fonte do elemento atual — se uma div tem font-size: 20px, então 1em = 20px dentro dessa div. rem é preferido para layout porque é consistente; em é preferido para tipografia dentro de componentes que precisam escalar com seu próprio tamanho de fonte.
Por que usar rem em vez de px?▾
Unidades rem respeitam as preferências de tamanho de fonte do navegador do usuário. Quando um usuário aumenta seu tamanho de fonte base do navegador para acessibilidade, layouts baseados em rem escalam proporcionalmente. Layouts baseados em px não. Além disso, rem simplifica a matemática do sistema de design — se sua escala de design é baseada em incrementos de 4px (0.25rem) ou 8px (0.5rem), valores rem traduzem diretamente. Tailwind CSS usa rem para todo espaçamento e tipografia (text-lg = 1.125rem = 18px em 16px raiz padrão).
Qual tamanho de fonte de raiz devo usar?▾
O padrão do navegador é 16px. A maioria dos sistemas de design (Tailwind, Material UI, Bootstrap) são baseados em 16px. Se você usa tamanho de fonte de raiz 62.5% (base 10px — um truque comum: html { font-size: 62.5% }), então 1rem = 10px, tornando a matemática mais simples (p.ex., 1.4rem = 14px). O truque 62.5% tem implicações de acessibilidade — sobrescreve a preferência de tamanho de fonte do navegador do usuário para todos os cálculos rem.
Como converto unidades de viewport (vw, vh)?▾
Unidades de viewport (vw, vh, svh, dvh) são relativas ao tamanho da viewport, não ao tamanho da fonte. 1vw = 1% da largura da viewport. 1vh = 1% da altura da viewport. Para converter: valor px = (valor vw / 100) × largura da viewport. Como o tamanho da viewport varia, vw/vh não podem ser expressos como um valor px fixo — este conversor se concentra em unidades relativas a fonte (px, rem, em).
O que é a função clamp() para tipografia fluida?▾
clamp(min, preferred, max) cria um valor que escala entre um mínimo e máximo. Para tipografia fluida: font-size: clamp(1rem, 2.5vw, 2rem) — a fonte escala com a largura da viewport mas nunca menor que 16px ou maior que 32px. Isso substitui múltiplos breakpoints para tipografia. O valor "preferred" é geralmente uma expressão vw-baseada: calc(1rem + 0.5vw) ou similar.