More
More
CSS Unit Converter
px, rem, em, vw and percent.
Free. Runs in your browser: nothing you enter or open is uploaded.
Sizes the relative units depend on
Common sizes
| px | rem | em | pt | vw | % |
|---|
CSS fixes 1 inch at 96 pixels, so 1pt is 1.333px and 1cm is 37.8px on screen whatever the monitor. rem follows the root font size, em and percent font sizes follow the parent element, and vw and vh are one hundredth of the viewport width and height.
How to use it
- Enter a value and choose the unit it is in.
- Set the root and parent font sizes and the viewport size if yours differ from the defaults of 16px and 1440 by 900.
- Read the value in every other unit and press Copy next to the one you need. The table below lists common sizes.
Questions
What is the difference between rem and em?
rem is relative to the root font size, set on the html element, so 1rem is the same everywhere on the page. em is relative to the font size of the element's parent, so it compounds when elements are nested.
How many pixels is 1rem?
16px in every major browser by default. If a reader raises the default font size in their browser settings, rem values grow with it, which is why rem is preferred for font sizes.
Are cm and inches real sizes on screen?
No. CSS defines 1 inch as 96 pixels, and screens differ in pixel density, so a CSS centimetre is rarely a real centimetre on a monitor. Physical units are meant for print style sheets.
What does percent mean in CSS?
It depends on the property. For font size it is a share of the parent font size; for width it is a share of the containing block's width. Choose which one under the settings.