Como converter um tamanho CSS
Informe o valor, escolha px, em, pt ou % e defina a referência em pixels. Converta para ver as quatro equivalências, cada uma com botão de cópia e sufixo CSS.
A referência representa 1em e 100%. Se o elemento pai usa font-size: 20px, informe 20. Ela altera em e %, mas não a relação entre px e pt.
Como o cálculo funciona
A entrada vira pixels primeiro: em × referência; % × referência ÷ 100; pt × 96 ÷ 72. As fórmulas inversas geram as demais unidades.
O cálculo interno mantém a precisão. A exibição remove resíduos decimais e não transforma valores positivos muito pequenos em zero.
Dois exemplos conferidos
24px com referência de 16px resultam em 24px, 1,5em, 18pt e 150%. Converter 1,5em com a mesma referência retorna 24px.
125% com referência de 20px resultam em 25px, 1,25em e 18,75pt. Com referência de 16px, os mesmos 125% viram 20px e 15pt.
Quando usar
Use para levar medidas de um design em pixels a CSS relativo, conferir tokens tipográficos, converter pontos de impressão ou resolver uma declaração herdada com tamanho pai conhecido.
16px é apenas um início comum. Registre a referência junto ao resultado para que outra pessoa reproduza a conta.
Limites e erros comuns
A ferramenta não interpreta calc(), clamp(), variáveis, folhas completas, rem nem unidades de viewport, e não inspeciona o DOM.
A porcentagem vale apenas para font-size. Não use o resultado em width ou height. Tamanhos negativos e referência zero são recusados.
Pontos seguem a relação das unidades CSS, não os pixels físicos de uma impressora. A altura visível também depende da fonte e de line-height.
Como usar a saída copiada
Cole o valor no componente real e teste também com texto ampliado no navegador. Uma unidade relativa não garante sozinha acessibilidade, contraste ou quebra de linha.
O cálculo ocorre no navegador e os valores não são enviados como parâmetros analíticos. Se a área de transferência falhar, selecione o resultado visível.
Todas as conversões de unidades de fonte CSS
| Direção da conversão | Fórmula com referência de 16px | Exemplo |
|---|---|---|
| Pixels para Em (px para em) | em = px × 0.0625 | 1px = 0.0625em |
| Pixels para Pontos (px para pt) | pt = px × 0.75 | 1px = 0.75pt |
| Pixels para Porcentagem (px para %) | % = px × 6.25 | 1px = 6.25% |
| Em para Pixels (em para px) | px = em × 16 | 1em = 16px |
| Em para Pontos (em para pt) | pt = em × 12 | 1em = 12pt |
| Em para Porcentagem (em para %) | % = em × 100 | 1em = 100% |
| Pontos para Pixels (pt para px) | px ≈ pt × 1.333333333 | 1pt ≈ 1.333333333px |
| Pontos para Em (pt para em) | em ≈ pt × 0.08333333333 | 1pt ≈ 0.08333333333em |
| Pontos para Porcentagem (pt para %) | % ≈ pt × 8.333333333 | 1pt ≈ 8.333333333% |
| Porcentagem para Pixels (% para px) | px = % × 0.16 | 1% = 0.16px |
| Porcentagem para Em (% para em) | em = % × 0.01 | 1% = 0.01em |
| Porcentagem para Pontos (% para pt) | pt ≈ % × 0.12 | 1% ≈ 0.12pt |
Perguntas frequentes
16px sempre equivalem a 1em?
Somente com referência de 16px. Com 20px, 1em equivale a 20px.
Por que a referência não altera pt?
Em e % são relativos; CSS fixa a relação 96px = 72pt.
Posso usar o % para largura?
Não. Aqui, % é porcentagem de font-size.
Por que o valor copiado é arredondado?
A interface remove ruído decimal; o cálculo usa o valor sem arredondamento.
A ferramenta converte rem?
Não. O escopo é px, em, pt e porcentagem de font-size.