Convert PX to REM
Common sizes at a 16px root
| px | rem | px | rem |
|---|---|---|---|
| 10 | 0.625 | 24 | 1.5 |
| 12 | 0.75 | 28 | 1.75 |
| 14 | 0.875 | 32 | 2 |
| 16 | 1 | 40 | 2.5 |
| 18 | 1.125 | 48 | 3 |
| 20 | 1.25 | 64 | 4 |
Turn the pixel sizes from a design file into rem for your CSS, or check what a rem value comes to in pixels. Change the root font size if your project does not use 16px.
- Free
- Runs in your browser
- Both directions
- No sign-up
How It Works
Convert sizes in three steps.
Enter a size
Type in the px field or the rem field.
Check the root size
16px is the browser default. Change it if your CSS sets a different html font size.
Copy with the unit
Copy rem or Copy px adds the unit, ready to paste into CSS.
Why use rem instead of px?
A rem is a multiple of the root (html) font size. At the browser default of 16px, 1rem is 16px and 1.5rem is 24px. Because rem follows the root size, text and spacing set in rem grow when a reader increases the default font size in their browser settings, while px values stay fixed. That is why accessibility guidance and frameworks such as Tailwind CSS use rem for font sizes and spacing.
em works like rem but is relative to the parent element's font size, so nested elements compound. rem is easier to predict, which is why it is the usual choice for sizes across a site.
rem = px ÷ root
24px at a 16px root is 24 ÷ 16 = 1.5rem.
Custom root size
Some projects set html { font-size: 62.5% } so that 1rem = 10px. Enter 10 as the root to match.
Reference table
Twelve common sizes from 10px to 64px, recalculated for your root size.
Clean decimals
Results are rounded to four decimal places without trailing zeros.
Convert PDF Files and File Formats
Find the perfect online tool to combine PDF files, compress documents, and handle your daily workflow effortlessly.
PDF Tools
All your PDF needs in one place
- Merge PDF
- Organize PDF
- Split PDF
- Compress PDF
- Convert to Word
- Convert to Image
Image Tools
Edit and optimize your images
- Resize Image
- Compress Image
- Convert Format
- Crop Image
- Add Watermark
- Remove Background
Word Tools
Work with Word documents
- Convert to PDF
- Merge Documents
- Split Documents
- Compress File
- Edit Text
- Add Watermark
Excel Tools
Process Excel spreadsheets
- Convert to PDF
- Convert to CSV
- Merge Sheets
- Split Sheets
- Compress File
- Clean Data
Why Use This Converter
Quick sums for CSS.
Two-way
Type in either field and the other updates.
Any root size
Works for 16px, 10px (62.5%) or any other base.
Cheat sheet
Common sizes are listed for quick lookup.
Private
Runs in your browser.
Frequently Asked Questions
Questions people ask about the PX to REM Converter.
16px in every major browser by default, unless the site changes the root font size or the reader changes their browser's default font size.
Divide the pixel value by the root font size: 18px ÷ 16 = 1.125rem.
Setting html { font-size: 62.5% } makes the root 10px (62.5% of 16px), so 1.4rem is 14px. It makes the maths easy, but you then need to set a body font size so text is not tiny by default.
Usually not. Thin borders and shadows are often kept in px so they stay crisp at 1px, while font sizes, spacing and layout widths use rem.
Related Text & Developer Tools
More small utilities that run in your browser.
Unit Converter
Convert length, weight, temperature, volume and more.
Color Converter
Convert colors between HEX, RGB, HSL and HSV.
Contrast Checker
Check text and background colors against WCAG.
CSS Gradient Generator
Build linear, radial and conic gradients for CSS.
Box Shadow Generator
Design CSS box shadows with live preview.