Blog
Unit converters

CSS units converter

Enter a value, choose a source and target unit, and set a base font size (default 16 px — the browser standard), and the converter recalculates the value between any pair of eight CSS units: pixels, points, inches, centimeters, millimeters, picas, em and rem.

Your data never leaves this device

The base font size is only used for converting em and rem — it has no effect for the other units (px, pt, in, cm, mm, pc), which have a fixed physical size.

Result

Result

This page has no server side at all. The table you paste is parsed by JavaScript inside your own browser, the chart is drawn on a canvas element on your machine, and the export file is assembled locally. Nothing is uploaded, stored or written to any log. You can disconnect from the network after the page has loaded and everything will still work — which is the simplest way to verify the claim yourself.

Facts and limits of this method

Base unit CSS pixel at 96 dots per inch — the CSS specification standard
1 point (pt) 96/72 px ≈ 1.333333 px
1 inch (in) 96 px
1 pica (pc) 16 px (1/6 inch)
1 em / 1 rem Equal to the base font size you set (default 16 px)

When it misleads you

How it is calculated

For units with a fixed physical size (px, pt, in, cm, mm, pc), exact conversion factors to pixels are preset per the CSS standard (96 px = 1 inch = 2.54 cm).

For em and rem, the conversion factor to pixels equals the base font size you specify (default 16 px — a typical browser default).

The entered value is multiplied by the factor of the selected "from" unit, giving a value in pixels.

The value in pixels is divided by the factor of the "to" unit, giving the result in the target unit, rounded to the chosen number of decimal places.

Questions and answers

Why do I need to specify a base font size?

Because em and rem are relative units: their physical size in pixels depends on what font size is treated as "1 unit". For the other units (px, pt, in, etc.) this field has no effect on the result.

How is rem different from em in practice?

rem is always measured from the page's root (html) element font size, while em is measured from the nearest parent's font size, which can cause em values to compound when nested; rem is usually more predictable in complex layouts.

What base font size should I use by default?

16 px is the standard default font size in most browsers, unless a site explicitly overrides it for the html element.

Is my data sent anywhere?

No, the whole calculation runs in your browser.

Related tools

All tools