96 pixels per inch was the nominal density of the displays CSS was standardised around, and it stuck as the reference. 72 is the number of points in an inch, which is a typography convention, not a screen one. Both are now fixed definitions rather than measurements of any real hardware.

Inches to Pixels Converter

Q: How do I convert inches (in) to pixels (px)?

Multiply by 96: 1in × 96 = 96px. The tool does this for you and lets you change the reference size, because that reference is what makes the answer different from one project to the next.

Q: What root font size should I use?

Browsers default to 16px, so 16 is the right starting point unless your stylesheet sets a different size on the html element. If your CSS sets `html { font-size: 62.5% }` — a common trick to make 1rem equal 10px — set the root size to 10 here instead.

Q: Should I use px or a relative unit?

Use relative units (rem, em) for anything that should scale with the reader's font-size preference: type, spacing, and container widths. Pixels are fine for things that genuinely should not scale, such as hairline borders and some shadow offsets. The accessibility rule of thumb is that a user who sets a larger default font size in their browser should see your layout grow with it.

Q: Is my data sent anywhere?

No. The conversion is arithmetic done in your browser — nothing is uploaded, and the page works offline once loaded.

Q: Will one CSS inch print as a real inch?

Yes, in a print stylesheet — that is exactly what absolute units are for. The browser maps CSS inches to physical inches on the sheet, so a 2in-wide label comes out two inches wide. On screen the same value is just 96px and has no physical meaning.

Convert inches to CSS pixels at the fixed 96px-per-inch ratio, with a note on what that means on screen versus paper.

Value to convert (in)

Result (px)

Root / parent font size

Browsers default to 16px. Use 10 if your CSS sets html { font-size: 62.5% }.

About this conversion

The same value at other root sizes

Root size	Result

Common conversions at 16 px

in	px

What It Does

CSS pins the inch to 96 pixels by definition, so this conversion is a fixed multiply that needs no font size and no device information. The number is genuinely useful for print stylesheets and for laying out things with a physical size — labels, badges, tickets, anything that will be measured with a ruler after it comes off a printer. On screen it is a reference ratio rather than a physical measurement: a CSS inch will not be an inch against your monitor, and this page explains where the difference bites.

When to Use It

You are converting a design handed over in inches (in) into a stylesheet that uses pixels (px) for accessibility.
You inherited a codebase that mixes units and you need the px equivalent of an existing in value.
You want to check what a in value becomes when the user changes their browser's default font size.
You are writing a design-token scale and need the same step expressed in both units.

Worked Examples

1

1 inch is 96px. This is the definition every other absolute CSS unit is built on.

0.5

Half an inch is 48px — a common print margin.

8.5

An 8.5 inch page width is 816px. Useful when laying out something that has to fit US Letter paper.

Features

Instant two-way conversion

Configurable root/parent font size

Full conversion table for common root sizes

Fractional-pixel rounding warning

Copy the value or the whole table

Works offline in your browser

No uploads or tracking

How to Use

1. Enter the measurement in inches. 2. Read the pixel equivalent — the ratio is fixed at 96px per inch, so no font size is needed. 3. Use the table for common fractions of an inch.

Common Mistakes

Expecting a CSS inch to measure one physical inch on your screen. It will not — it is a reference unit fixed at 96px, and screens vary in physical density.
Using inches for on-screen layout. They freeze the size and ignore the reader's settings; keep them for @media print where paper really is measured in inches.
Assuming 96 DPI describes your display. Modern screens run far higher densities; the browser maps one CSS pixel onto several device pixels and the CSS arithmetic stays the same.
Mixing inches and millimetres in one print stylesheet — both work, but switching between them mid-file makes proofing errors much easier to miss.

Frequently Asked Questions

How do I convert inches (in) to pixels (px)?

What root font size should I use?

Should I use px or a relative unit?

Is my data sent anywhere?

Will one CSS inch print as a real inch?

Why 96 and not 72?

The conversion runs entirely in your browser. Nothing is uploaded and nothing is stored.