Converta pontos tipográficos em pixels

O ponto é uma unidade da tipografia impressa. Um ponto mede 1/72 de polegada, ou seja 0,3528 mm, e é essa a medida que o Word, o InDesign e o Illustrator apresentam quando define o corpo de letra. O pixel é uma unidade de ecrã e, numa folha de estilos, corresponde a 1/96 de polegada, isto é 0,2646 mm [1]. Toda a conversão se resume à relação entre estes dois números: 96 a dividir por 72 dá 1,333.

Daí nasce o par que qualquer programador sabe de cor: 12 pt são 16 px. Dezasseis pixels é o tamanho de texto que cada navegador assume por omissão e o valor que um rem toma, pelo que um documento composto em corpo doze leva exatamente o mesmo corpo para uma página web.

O conversor serve a quem entrega uma maquete ao desenvolvimento, a quem monta uma assinatura de correio e a quem recebe uma especificação em pontos enquanto trabalha numa ferramenta que conta em pixels.

Mais abaixo encontra uma tabela com 30 corpos de letra, outra com as espessuras de traço, a comparação de cinco sistemas de pontos e as instruções para mudar a unidade no Illustrator, no Photoshop, no InDesign, no Affinity, no Inkscape, no Figma e no Word. O caminho inverso é tratado pelo conversor de pixels para pontos.

A fórmula tem uma única forma: pixels = pontos × 96 ÷ 72, ou seja multiplicar por 4/3. No sentido inverso basta multiplicar os pixels por 0,75. Dezoito pontos dão 24 px, vinte e quatro pontos dão 32 px e 36 pt dão 48 px certos.

Setenta e dois pontos são exatamente uma polegada, pelo que 72 pt correspondem a 96 px e a 25,4 mm. Esta igualdade serve de verificação prática quando faz a conta de cabeça. Vale também para baixo: 0,75 pt são exatamente um pixel e 1,5 pt são dois.

E de onde vem o 96? O W3C fixou que uma polegada na folha de estilos tem 96 pixels e descreveu o pixel de referência como o ângulo visual de um pixel num ecrã de 96 dpi visto à distância de um braço estendido [1]. O número em si é mais antigo do que a web e resulta de uma decisão tomada na Microsoft nos anos oitenta.

O ecrã do primeiro Macintosh tinha 512 × 342 pontos luminosos e uma densidade de 72 PPI, escolhida para que um pixel calhasse num ponto tipográfico. Os monitores de PC andavam por valores próximos, mas na Microsoft notaram que um monitor fica cerca de um terço mais longe dos olhos do que uma folha de papel na mão e que, por isso, o texto no ecrã tem de ser maior. O Windows passou a declarar uma densidade aumentada precisamente nesse terço: para ecrãs realmente a 72 PPI indicava 96 PPI [2]. O texto tornou-se legível, um corpo onze no Windows correspondia a um corpo oito no Macintosh, e o 96 ficou no sistema, depois nos navegadores e por fim na norma CSS.

Durante quase toda a história da imprensa o ponto significava coisa diferente em cada país e cada fundição tipográfica guardava as suas próprias medidas. Pierre Simon Fournier foi o primeiro a pôr ordem nisso, em 1737, talhando os punções numa escala de 72 pontos por polegada de Paris. Meio século depois François-Ambroise Didot ligou o seu ponto a 1/864 do pé do rei, do que resultaram 0,376065 mm a 20 °C, e essa medida espalhou-se por toda a Europa continental [3].

Doze pontos Didot formam um cícero, que mede 4,512 mm. O nome vem de Veneza: em 1469 João e Vindelino de Espira imprimiram ali as Epistolae ad familiares de Marco Túlio Cícero num carácter exatamente desse corpo. No mundo anglo-saxónico a unidade correspondente chama-se pica.

O valor redondo só chegou com o PostScript. A Adobe decidiu em 1984 que um ponto mediria exatamente 1/72 de polegada, e a Apple construiu sobre isso a tipografia do Macintosh, cujo ecrã tinha então 72 pixels por polegada. É com esse ponto que o conversor acima calcula, e é a sua definição que a norma CSS repete [1]. Doze desses pontos formam uma paica, que a 96 DPI dá 16 pixels exatos e a 300 DPI dá 50 — esse passo é calculado pelo conversor de paicas para pixels.