REM to PX Converter
Convert rem values to pixel units instantly. Enter a rem value and base font size to get the exact pixel equivalent — useful when debugging CSS or working with design specs.
Bulk Converter
Quick reference table showing common rem values converted to pixels at the current base font size.
| REM | PX (base 16) |
|---|---|
| 0.25rem | 4.00px |
| 0.5rem | 8.00px |
| 0.75rem | 12.00px |
| 1rem | 16.00px |
| 1.25rem | 20.00px |
| 1.5rem | 24.00px |
| 2rem | 32.00px |
| 2.5rem | 40.00px |
| 3rem | 48.00px |
| 4rem | 64.00px |
When Do You Need to Convert REM Back to PX?
While rem is the recommended unit for accessible, scalable CSS (see the MDN rem documentation and the W3C CSS Values Level 4 spec), there are several practical reasons to convert rem back to px. Design tools like Figma and Sketch often work in pixels, so when a designer hands off specs in px you may need to verify that your rem values match. When debugging layout issues in browser DevTools, the computed values panel shows pixels — knowing what your rem values resolve to helps you cross-check. Third-party libraries sometimes require px values. And when integrating with native platforms or canvas-based rendering, pixel values are often required. caniuse.com confirms rem is universally supported, so you can safely use rem in production and only convert to px where absolutely needed. CSS-Tricks has a great article on rem vs em and the MDN CSS Values and Units guide covers every length unit. The formula is simple: px = rem × base font size. At the default 16px base, 1.5rem = 24px, 2rem = 32px, and so on.
How to Use This Converter
Enter Your REM Value
Type the rem value you want to convert into the REM input field. The result updates instantly as you type.
Set the Base Font Size
The base font size defaults to 16px, which is the browser default. If your project sets a different root font size, change it here to get an accurate pixel value.
Copy the Result
The pixel value appears immediately. Click Copy to put it on your clipboard and use it wherever you need px.
Frequently Asked Questions
What is the formula to convert rem to px?
The formula is: px = rem × base font size. For example, 1.5rem at base 16px = 1.5 × 16 = 24px. At base 10px, 1.5rem = 15px.
Why would I need to convert rem to px?
Common reasons: matching px values in design files (Figma, Sketch), verifying computed values in browser DevTools, integrating with third-party libraries that require px, and working with canvas or native rendering contexts.
What base font size should I use?
Use the font size set on your <html> element. If you haven't changed it, it's 16px. Check with getComputedStyle(document.documentElement).fontSize in the browser console.
Does the base font size affect all rem values on the page?
Yes. Every rem value on the page resolves relative to the <html> font size. If you change the root font size, all rem-based measurements scale proportionally — which is the whole point of using rem.
What is the difference between rem and em?
rem is always relative to the root (<html>) font size. em is relative to the font size of the current element, which can compound in nested elements. rem is more predictable for layout and spacing.
Related Tools
References: MDN — rem length unit · W3C CSS Values Level 4 — rem · Can I Use — rem · CSS-Tricks — rem vs em · MDN CSS Values and Units