CSS Unit Converter
Convert a CSS length between pixels, rem, em, percent, points, viewport units and physical units, using your own root font size and viewport.
Result
Enter a value to convert between CSS units.
How to use this tool
- Enter a value and its unit.
- Adjust the root font size (16 px in browsers by default), the parent font size for em and %, and the viewport size for vw and vh.
- See the value in every unit, plus a table of common pixel sizes in rem.
How it works
Every value is converted to pixels first: 1rem = root font size, 1em = parent font size, 1% = 1/100 of the parent font size, 1vw = 1% of the viewport width, 1vh = 1% of the viewport height. Absolute units follow the CSS definitions: 1in = 96px, 1pt = 1/72in, 1pc = 12pt, 1cm = 96/2.54 px.
Example
24px
With a 16px root, 24px = 1.5rem = 18pt = 0.25in, and 1.6667vw on a 1440px-wide screen.
Privacy and limitations
- Everything runs in your browser; nothing you enter is uploaded or stored.
- CSS inches and centimetres are defined in pixels and rarely match physical sizes on screen.
Frequently asked questions
Should I use rem or px?
rem for font sizes and spacing, so the page scales when people change their browser’s default text size; px for things like borders that should stay thin.
What is the difference between rem and em?
rem is relative to the root (html) font size everywhere; em is relative to the current element’s font size, so it compounds when nested.