CSS Unit Converter
Convert CSS units between pixels, em, rem, percent, points, viewport units, and physical dimensions with custom base font and screen sizes.
Run tool
Convert measurement values between absolute and relative CSS units for responsive web layouts. The converter supports ten distinct CSS units: pixels, em, root em, percentages, points, viewport width, viewport height, centimeters, millimeters, and inches. Every conversion calculates an intermediate pixel value before producing the target output rounded to four decimal places. You can customize the base font size, which defaults to 16, to adjust proportional calculations for em, rem, and percentage values. For viewport-based units like vw and vh, configurable viewport width and height dimensions ensure precise translations matched to your target screen resolution, defaulting to 1920 by 1080 pixels. Absolute physical units translate using standard desktop ratios, including 96 pixels per inch and 1.33333 pixels per point. When you enter custom layout measurements, the converter updates the converted amount and intermediate pixel measurement instantly. This tool helps web developers translate design mockups, tune typographic scale, and calibrate responsive container dimensions across varying screen sizes accurately.
Instructions
- Enter the numeric value you want to convert in the Value field.
- Select the source unit from the From unit dropdown menu.
- Select the desired target unit from the To unit dropdown menu.
- Adjust the Base font size if your project uses a root size other than 16 pixels.
- Update the Viewport width and Viewport height fields if converting to or from viewport units like vw or vh.
- Review the calculated target value and intermediate pixel equivalent in the result panel.
Examples
- Convert 24 px to rem with a base font size of 16 px to get 1.5 rem.
- Convert 50 vw to px with a viewport width of 1920 px to get 960 px.
- Convert 2 rem to % with a base font size of 16 px to get 200%.
FAQ
How does the converter calculate rem and em values?
The converter multiplies or divides values relative to the configured base font size, which defaults to 16 pixels.
How do viewport units like vw and vh get calculated?
One vw equals 1% of the viewport width, and one vh equals 1% of the viewport height based on the entered screen dimensions.
What happens if the base font size is set to zero?
When the base font size is set to zero, the result panel shows 0 for conversions to em, rem, or percentage to avoid division errors.
What precision is used for conversion outputs?
The converted numerical value and the intermediate pixel representation are rounded to four decimal places.