Typography Unit Converter
Data & DigitalConvert CSS and print typography units instantly — pixels, points, rem, em, pica, centimetres, and inches. Based on 96 DPI screen and 16 px default font size.
From
To
All conversionsfor 1 Pixel (px)
| Pixel (px) | 1 |
| Point (pt) | 0.75 |
| Pica (pc) | 0.0625 |
| Root em (rem) | 0.0625 |
| Em (em) | 0.0625 |
| Ex (ex) ≈ 0.5em | 0.125 |
| Ch (ch) ≈ 0.5em | 0.125 |
| Centimetre (cm) | 0.026458333 |
| Millimetre (mm) | 0.26458333 |
| Inch (in) | 0.010416667 |
What is a Typography?
A Typography Unit Converter translates between the measurement units used in screen design and print layout — pixels, points, picas, em, rem, centimetres, millimetres, and inches. Designers and developers routinely work across tools and systems that use different unit conventions: CSS uses px, rem, and em; design tools like Figma and Sketch use px; print specifications use pt, pc, cm, and mm; and older systems use pica-based measurements.
The converter assumes two standard reference values: 96 DPI (the CSS reference pixel density used by all major browsers on standard screens) and 16 px root font size (the default browser HTML font size). All relative units — em, rem, ex, ch — are calculated from this 16 px base.
At 96 DPI, the unit relationships are fixed:
- 1 inch = 96 px
- 1 cm = 37.795 px
- 1 mm = 3.78 px
- 1 pt = 96/72 px ≈ 1.333 px
- 1 pc = 12 pt = 16 px
- 1 rem = 1 em = 16 px (at default root)
These conversions are critical when translating between a print brief (body copy at 9 pt, margins at 1.5 cm) and a CSS stylesheet, or when moving between design tools and front-end code.
For converting data storage units relevant to digital assets, see the Data Storage Converter.
How to use this Typography calculator
- Enter a value in the From field — for example,
24. - Select the From unit — e.g.
Pixel (px). - Select the To unit — e.g.
Point (pt). - The converted value appears instantly.
- Use the reference table below to see the value expressed in all other units at once.
- Click the ⇄ swap button to reverse the conversion direction.
Formula & Methodology
Base unit: pixel (px) at 96 DPI / 16 px root.
Conversion formula: Result = Input × (toBase_from ÷ toBase_to)
| Unit | toBase (× px) |
|---|---|
| px | 1 |
| pt | 1.3333 (= 96/72) |
| pc | 16 (= 12 pt) |
| rem | 16 |
| em | 16 |
| ex | 8 (≈ 0.5 em) |
| ch | 8 (≈ 0.5 em) |
| cm | 37.795 (= 96/2.54) |
| mm | 3.7795 (= 96/25.4) |
| in | 96 |
Worked example: Convert 1.5 rem to pt.
- 1.5 rem × 16 (toBase) = 24 px
- 24 px ÷ 1.3333 (pt toBase) = 18 pt ✓
Common reference values:
| px | rem | pt | cm |
|---|---|---|---|
| 12 | 0.75 | 9 | 0.318 |
| 14 | 0.875 | 10.5 | 0.370 |
| 16 | 1 | 12 | 0.423 |
| 18 | 1.125 | 13.5 | 0.476 |
| 24 | 1.5 | 18 | 0.635 |
| 32 | 2 | 24 | 0.847 |Frequently Asked Questions
What typography units are covered by this converter?
The converter handles all common CSS and print typography units: pixel (px), point (pt), pica (pc), root em (rem), em (em), ex, ch, centimetre (cm), millimetre (mm), and inch (in). These cover screen design, web development, and print layout in a single tool.
What base assumptions does this converter use?
The converter assumes a screen resolution of 96 DPI (dots per inch) and a root font size of 16 px, which are the browser defaults. All em, rem, ex, and ch values are calculated relative to this 16 px root. If your project uses a different root font size (e.g. 62.5% = 10 px), manually adjust by multiplying your rem value by the ratio.
What is the difference between rem and em?
Both rem and em are relative units, but rem is always relative to the root element font size (typically 16 px on the HTML element), while em is relative to the font size of the current element. Because em cascades, nested elements can multiply the size unexpectedly — rem avoids this by always referencing a single fixed root. In modern web development, rem is preferred for layout and spacing.
What is the relationship between pixels and points?
On a 96 DPI screen, 1 point (pt) equals exactly 96/72 pixels, which is approximately 1.333 px. Points are a physical print unit defined as 1/72 of an inch. At the standard 72 DPI print resolution, 1 pt = 1 physical pixel, but at 96 DPI screen resolution the ratio is 4:3.
What is a pica?
A pica (pc) is a typographic unit equal to 12 points. At 96 DPI, 1 pica = 12 × (96/72) = 16 px — the same as 1 rem at the default browser root font size. Picas are used in print design, particularly for column widths, margins, and leading (line spacing).
How do I convert px to rem for CSS?
Divide the pixel value by the root font size (16 by default). So 24 px ÷ 16 = 1.5 rem. The converter does this automatically. If your project sets html { font-size: 62.5%; } (so 1 rem = 10 px), divide by 10 instead of 16.
Are em and ex the same thing?
No. Em is the full height of the current font's em square (equal to the font-size value). Ex is the x-height — approximately the height of a lowercase 'x' in the current font, roughly 0.5 em. Ch is similarly approximate — about the width of the '0' character. Both ex and ch are approximations because they vary by typeface.
When should I use px vs rem for CSS font sizes?
Use rem for font sizes and spacing so that users who change their browser's base font size (for accessibility) have the change respected throughout your layout. Use px only for elements that must never change size regardless of user preferences — borders, fine dividers, and decorative marks. Avoid pt in CSS; it is a print unit and its screen rendering depends on the DPI setting.
What is the px equivalent of common print font sizes?
At 96 DPI: 10 pt = 13.3 px, 11 pt = 14.7 px, 12 pt = 16 px, 14 pt = 18.7 px, 18 pt = 24 px, 24 pt = 32 px, 36 pt = 48 px. The converter gives precise values for any input.
How do I convert centimetres to pixels for CSS?
At 96 DPI, 1 cm = 37.795 px. So a 2.5 cm margin is approximately 94.5 px. Note that CSS cm, mm, and in units also resolve to pixels at 96 DPI in a browser — using them directly in CSS is valid and the browser converts them internally.
Does this converter work for print stylesheets?
Yes. For print stylesheets (media type 'print'), points and picas are the natural units and px/cm/mm also work. This converter is useful for translating between print specifications (e.g. a designer specifying 9 pt body copy) and CSS values (12 px).