CSS units converter
Convert px, rem, em, pt and the other CSS length units.
Fill in the fields and the result will appear here automatically.
Compare CSS lengths through the CSS pixel using explicit rem and em bases. Fixed ratios are 1in=96px, 1pt=96/72px and 1pc=16px. rem uses the computed root font size. For ordinary properties, em uses the element’s own computed font size; in font-size it uses the inherited size. The em-base field lets you supply the relevant context without assuming nesting.
How it works
Formula and logic
Each unit has a factor f in CSS pixels. Result = value·fsource/ftarget. rem uses the root size and em the supplied em base; 1cm=96/2.54px and 1mm=96/25.4px. Both bases must be positive because the comparison rows use them too. Zero and negative lengths are accepted arithmetically, although a particular CSS property may disallow them.
Example
With a 16 px root, 24 px is 1.5 rem and 18 pt.
Fields and units
- Value — px
- From unit — list option
- To unit — list option
- Root font size — px
- em base — px
How to use
- — Choose source and target units and enter the length.
- — Enter the computed root font size and the applicable em base in CSS pixels.
- — Read the target unit in the result label; comparison rows use the same bases.
Method and limitations
- Calculation method
- Formula and logic
- Data or methodology source
- W3C CSS Values 3: em/rem bases and absolute units (draft)
- Limitation
- CSS-length conversion with the supplied context; it does not measure display density or validate a length for a particular property.
FAQ
How do rem and em bases differ?
rem uses the computed root font size. For margin or width, em refers to the element’s own font; for font-size, it refers to the inherited size. Enter the base that applies to the property you are converting.
Does a CSS centimetre match a physical one?
The cm-to-px ratio is fixed: 1cm=96/2.54px. Physical size depends on the device’s anchoring of absolute units; an on-screen ruler match is not guaranteed.
Does px disable browser zoom?
No. Page zoom also works with px. rem can follow a user’s root font setting; assess accessibility on the actual layout rather than from one chosen unit.
Does 62.5% always make the root 10px?
Only when the initial size is 16px: 0.625·16=10. A user’s initial 20px font gives 12.5px. Enter the actual computed root size here.