Unidades CSS·54px
54px =
3.375rem
40.5pt

54 px em rem — 3.375 rem, 40.5 pt

54 px são 3.375 rem e 40.5 pt: 0.5625 polegadas, 14.288 mm e 337.5% do tamanho de fonte raiz.

rem (raiz 16 px)
3.375rem
pt (pontos)
40.5pt
pc (paicas)
3.375pc
porcentagem da raiz
337.5%
polegadas
0.5625in
milímetros
14.288mm
centímetros
1.4288cm

Por que rem se divide por 16

Porque os navegadores definem o tamanho de fonte raiz em 16 px e rem é um múltiplo dele. Se o leitor aumentar o texto no navegador, só cresce o que está em rem; o que foi fixado em px permanece.

Tamanhos próximos

pxrem (raiz 16 px)pt (pontos)
51px3.1875rem38.25pt
52px3.25rem39pt
53px3.3125rem39.75pt
54px3.375rem40.5pt
55px3.4375rem41.25pt
56px3.5rem42pt
57px3.5625rem42.75pt

Na tela, pt e polegadas continuam sendo pixels

O CSS fixa uma polegada em 96 px e um ponto em 1/72 de polegada. Assim, 16 px são exatamente 12 pt — mas encoste uma régua na tela e essa "polegada" não medirá uma polegada.

Os tamanhos mais comuns

Texto base em 16, texto pequeno em 14, espaçamentos de 8, 24 e 32: os valores que se repetem.

Como ler

  • rem = px ÷ 16, porque os navegadores fixam a fonte raiz em 16 px.
  • pt = px × 0,75, já que o CSS fixa a polegada em 96 px e o ponto em 1/72 de polegada.
  • Um pc são 12 pt, e uma polegada são 96 px e também 72 pt.
  • Use rem para texto e espaçamentos; deixe px para linhas finas como bordas.

Perguntas frequentes

Q. Quantos rem são 54 px?

3.375 rem, ou seja 54 dividido por 16.

Q. Quantos pontos são 54 px?

40.5 pt. Um ponto é 1/72 de polegada e uma polegada 96 px, então multiplica-se por 0,75.

Q. Que comprimento é esse?

0.5625 polegadas, ou 14.288 mm — embora uma régua na tela não concorde.

Q. E em porcentagem?

337.5% do tamanho de fonte raiz.