📏 CSS Unit Converter

px ⇄ rem ⇄ pt ⇄ % · your root size · em left honest

Advertisement

One input value, every unit it equals, at the root font size you choose (default 16 px, the CSS spec’s initial value). pt is CSS’s print unit — defined as 1/72 inch at 96 dpi, so 1 pt = 4/3 px exactly. rem is simply value ÷ root size. And em is deliberately not in the table: em resolves against the element’s own inherited font size, which a converter on a website cannot know — the note under the table gives the one rule that keeps em from biting you.

px
—

The pt is not the Word “point” you know

DTP uses 72 pt = 1 inch and print measures at ~72 “dpi”, so 12 pt looked the same size on screen and paper. CSS kept the unit but anchored it to the screen: a CSS inch is 96 px, a CSS pt is 4/3 px — so 12 pt renders as 16 px, which is why browsers’ default text size is 16 px and is called “medium” in the spec. When a design tool’s pt and your stylesheet’s pt disagree by a third, this is the disagreement. For web work px and rem cover almost everything; pt earns its place only in @media print.

Part of Everyday Tools. Like everything on tukuk.org: free, no account, no tracking.

Advertisement
Advertisement