Font Size Converter
Convert between points (pt), pixels (px), em, rem, and millimeters for typography in print and web design.
Type in any field — the others update instantly. Base font size is 16px (default browser setting).
72 pt = 96 px = 6 rem = 1 inch
10 pt (print body) = 13.33 px = 0.833 rem
Understanding Font Size Units
Typography uses several different units to specify font sizes, and the correct unit depends on the medium (print or screen) and the design system being used. Understanding how these units relate to each other is essential for designers, developers, and anyone working with text layouts.
Core Font Size Units:
- Points (pt): The traditional typographic unit, defined as 1/72 of an inch. Used primarily in print design.
- Pixels (px): The standard unit for screen display. On a 96 DPI screen (the CSS reference), 1 px = 1/96 of an inch.
- Em: A relative unit equal to the current element’s font size. If the parent element is 16 px, then 1 em = 16 px.
- Rem (root em): A relative unit equal to the root element’s (html) font size. Most browsers default to 16 px.
- Millimeters (mm): Physical measurement used in print design alongside points.
Conversion Formulas (at 96 DPI, 16px base):
- Points to pixels:
px = pt × 96/72 = pt × 1.3333 - Pixels to points:
pt = px × 72/96 = px × 0.75 - Pixels to em/rem:
em = px / base font size(base is usually 16 px) - Em/rem to pixels:
px = em × base font size - Points to mm:
mm = pt × 0.3528 - Mm to points:
pt = mm / 0.3528 = mm × 2.8346 - Pixels to inches:
inches = px / 96(at 96 DPI)
Common Font Size Reference Table:
| Points (pt) | Pixels (px) | Em/Rem (base 16) | Millimeters | Common Use |
|---|---|---|---|---|
| 6 pt | 8 px | 0.500 | 2.12 mm | Fine print, legal text |
| 8 pt | 10.67 px | 0.667 | 2.82 mm | Footnotes, captions |
| 9 pt | 12 px | 0.750 | 3.18 mm | Small body text |
| 10 pt | 13.33 px | 0.833 | 3.53 mm | Standard body text (print) |
| 11 pt | 14.67 px | 0.917 | 3.88 mm | Book text |
| 12 pt | 16 px | 1.000 | 4.23 mm | Default body text (web) |
| 14 pt | 18.67 px | 1.167 | 4.94 mm | Large body, subheadings |
| 16 pt | 21.33 px | 1.333 | 5.64 mm | Subheadings |
| 18 pt | 24 px | 1.500 | 6.35 mm | H3 headings |
| 24 pt | 32 px | 2.000 | 8.47 mm | H2 headings |
| 30 pt | 40 px | 2.500 | 10.58 mm | H1 headings |
| 36 pt | 48 px | 3.000 | 12.70 mm | Large headings |
| 48 pt | 64 px | 4.000 | 16.93 mm | Display headings |
| 72 pt | 96 px | 6.000 | 25.40 mm | 1 inch = banner text |
Why 16px = 12pt = 1rem:
Most web browsers use 96 DPI as the CSS reference resolution and set the default root font size to 16 pixels. Since 12 points equals 16 pixels at 96 DPI, and 1 rem equals the root font size, all three values align at the browser default.
Practical Examples:
- A print designer specifies 10pt body text. For a matching web design, use 13.33px or 0.833rem.
- A web developer sets headings at 2rem (32px). The print equivalent is 24pt.
- A poster with 72pt text has letters approximately 1 inch (25.4 mm) tall — useful for readability at a distance.
Tips:
- Use rem for web design to maintain consistent sizing relative to the user’s browser settings.
- Em units compound (1.2em inside 1.2em = 1.44× the base), while rem always refers to the root.
- For accessibility, avoid setting font sizes in px when the user should be able to override them. Use rem instead.
- Print designers should specify sizes in points. Screen designers should use pixels or rem.