A design spec in pixels
A 24px heading size becomes 1.5rem in the stylesheet.
Use px to rem
Converts pixels to rem in this tab, with nothing sent anywhere.
Runs entirely on your deviceThe conversion happens in this browser tab. Nothing you type is uploaded, logged or stored, which is worth knowing for anything you would not paste into a search box.
A 24 px heading becomes 1.5 rem when the root font size is 16 px. The browser default is common but not guaranteed; enter the root value from the actual stylesheet when auditing an existing design system.
Explore general converters
Find related browser-local tools for nearby tasks without starting another search.
Browse all general convertersAbout px to rem
In CSS, rem units scale with the user's root font size, which makes them the accessible choice for spacing and type - but designs and mockups are drawn in pixels. Converting pixels to rem lets a developer turn a pixel value from a design into the rem a stylesheet should use. Against the 16px browser default, 16px is 1rem, 24px is 1.5rem and 8px is 0.5rem. Accessible design is the reason to bother: because rem scales with a reader's chosen font size, converting a fixed pixel spec to rem lets the layout grow for people who enlarge text. Design tokens in a modern system are stored in rem, so converting a pixel value from an old mockup is the first step in migrating it into the token scale. Check the computed root font size in the actual page before replacing a pixel value with rem. For example, 24px is 1.5rem at a 16px root, but 1.2rem at a 20px root. The root assumption must travel with a converted design token.
Using px to rem
- Type a number of px. You can paste a value with its unit; the tool reads the number.
- The exact factor is applied and the result is shown as rem, updating live as you type.
- Copy the answer, or switch to the reverse converter to go from rem back to px.
Where px to rem helps
Both directions
Need the opposite? The rem-to-px converter is linked below and uses the exact inverse factor.
Check the computed root size
At a 16 px root, 32 px becomes 2 rem. If the page instead uses a 20 px root, the equivalent is 1.6 rem. This tool's fixed 16 px assumption is therefore only appropriate when that is the actual root value. Inspect the computed font size on the html element, and test the layout with larger text settings before replacing pixel declarations throughout a stylesheet.
Before you use the result
- The result is rounded for readability, so a value converted and then converted back may differ in the last decimal place. The underlying factor is exact.
- Units in your input are ignored - only the number is read - so make sure the figure you type is really in px.
Questions about px to rem
What base does this assume?
The 16px browser default root font size, where 16px equals 1rem. If your root is set differently, divide by that value instead.
Is my data uploaded?
No. px to rem does the arithmetic in this browser tab; the value is calculated on your device and is not sent to a server.
Related tools
rem to px
Convert rem to px instantly in your browser. Exact factor, both directions, nothing uploaded.