CSS Unit Converter
Convert CSS units between px, rem, em, vw, vh, pt, pc, cm, mm, and in. Set custom base font size and viewport size for accurate results.
What Is a CSS Unit Converter?
CSS supports many length units — absolute (px, pt, cm, in) and relative (rem, em, vw, vh). Converting between them requires knowing the base font size and viewport dimensions. This tool does all the math for you.
How to Use
- Set your Base Font Size (default 16 px, the browser default)
- Set Viewport Width and Height for vw/vh conversions
- Enter a value in any unit field — all other fields update instantly
- Click Copy to copy a specific value
Features
- 10 CSS units: px, rem, em, vw, vh, pt, pc, cm, mm, in
- Configurable base font size, viewport width and height
- Live conversion — change any field and all others update
- Results rounded to 6 significant figures
FAQ
What is the difference between rem and em?
rem is relative to the root element font size (usually html), while em is relative to the current element's parent font size. In this tool both use the same base font size for simplicity.
What is the default browser font size?
Most browsers default to 16 px. This is why 1 rem = 16 px by default. If your html element sets a different font size, update the base font size accordingly.
How accurate are physical units (cm, mm, in)?
CSS defines 1 in = 96 px at 96 DPI. On high-DPI screens the CSS pixel is a logical unit, so physical accuracy depends on the device. These conversions are correct for CSS layout purposes.
Why does vw/vh need a viewport size?
1vw = 1% of the viewport width. Since this tool runs offline, you manually set the target viewport dimensions to get accurate vw/vh values.