PX to REM

One rem is the root font size — whatever html is set to, 16px unless someone changed it, and whatever the reader changed it to in their browser settings. One em is the font size of the element's own parent, which is why em compounds when you nest it and rem does not; the second box is that parent size, and it only moves the em line. Points are a fixed ratio in CSS: 1pt is 1/72 of an inch and 1px is 1/96, so 1px is exactly 0.75pt whatever the font size is. Nothing here depends on the screen: CSS px are a unit of the document, not of the hardware pixels a phone packs into them.

The value is read as a decimal number, converted to px, and printed back in each unit to at most five decimals with the trailing zeros dropped. When a result cannot be written exactly in five decimals — 10px in a 3px root is 3.33333rem — the page marks it ≈ rather than pretend. Values are refused above a billion in any unit, and a root or parent size of zero is refused rather than divided by: nothing sensible comes back from it. Negative lengths are converted, because some properties take them.

The second column is the same conversion for the sizes people usually need — 8 to 72px — against the root you typed, so a scale can be read off in one go rather than converted one line at a time. Copy takes the value in the unit you did not start from: the rem when you typed px, the px otherwise.

Nothing is uploaded and nothing you type is stored; the Dark button keeps its own setting in this browser's local storage.