About This Tool
px to rem converts pixels to rem based on the root element's font size. The default is 16px, but you can use 10, 14, 18, or another positive value to match your project.
How to Use
- Enter the px values you want to convert.
- Set your project's actual Root Font Size, which must be greater than 0.
- View the result and calculation explanation.
- Copy the rem result, or clear the input to convert other sizes.
Examples
- 32px ÷ 16px = 2rem.
- 24px ÷ 16px = 1.5rem.
- 20px ÷ 10px = 2rem.
How the Calculation Works
rem = px / rootFontSize. Tools 095 and 096 share the same conversion logic. Results use a practical number of decimal places and omit unnecessary trailing zeros. Browsers commonly default to a 16px root font size, but project CSS and user settings can change it. Use the actual value when converting.
Common Uses
- Convert pixel dimensions in design files to rem.
- Use consistent units for project spacing and font sizes.
- Check how different root font sizes affect conversions.
Privacy
All input processing, calculations, CSS generation, and previews run in your browser. Your content is never uploaded. No backend, database, online API, or third-party CDN is used, and your input is not saved automatically.
FAQ
What is rem?
rem is a CSS length unit relative to the document root element's font size. The root element is usually html.
How many pixels are in 1rem?
It depends on the root font size. With a 16px root, 1rem = 16px; with a 10px root, 1rem = 10px.
Why can't Root Font Size be 0?
Converting px to rem divides by the root font size, so zero would cause division by zero. Negative values are also invalid font sizes.
What is the difference between rem and em?
rem uses the root element's font size. em usually relates to the current element's font size; when used for font-size itself, it relates to the parent's computed font size.