En punkt är 1,3333 pixlar vid 96 dpi. Sambandet är fastlagt av CSS-specifikationen och inte av någon fysisk skärm: en CSS-pixel definieras som 1/96 tum och en punkt som 1/72, så förhållandet är exakt 96/72.
Om enheterna
Punkten är typografins traditionella storleksenhet, exakt 1/72 tum sedan PostScript standardiserade den på 1980-talet. Pixeln i webbdesign är ingen hårdvarupixel alls — CSS-specifikationen definierar en referenspixel som synvinkeln för 1/96 tum på armslängds avstånd, och webbläsaren avbildar sedan det på vad skärmen faktiskt har. På en högupplöst skärm kan en CSS-pixel vara två eller tre fysiska pixlar, vilket är skälet till att ett 16-pixels typsnitt ser lika stort ut på en telefon och en bildskärm trots vitt skilda pixeltätheter.
Den exakta faktorn
Faktorn är exakt 96 ÷ 72 = 4/3 = 1,3333. Så 12 pt är 16 px, 9 pt är 12 px och 18 pt är 24 px. Talet 96 dpi kommer ur Microsofts beslut att antaga den tätheten för skärmrendering i Windows, vilket CSS-specifikationen senare tog upp som referens. Det var aldrig sant om någon bestämd bildskärm; det var en konvention vald så att text angiven i punkter skulle bli läsbar på en typisk skärm från 1990-talet.
Var du stöter på omvandlingen
Webb- och gränssnittsdesign, där en formgivare arbetar i punkter i ett tryckorienterat program och en utvecklare genomför det i pixlar. Grafiska profiler som anger typografi i punkter måste översättas, och att 12 pt brödtext blir 16 px är fältets enskilt vanligaste omräkning. Anpassning av tryckta profiler till webb går genom den. Notera att modern CSS-praxis föredrar rem framför båda, just eftersom rem skalar med användarens valda grundstorlek i stället för att vara fast.