PX to REM Converter
Free online pixel to REM converter. Convert px to rem instantly with a customizable root font-size, a full conversion table, Tailwind breakpoint values (sm, md, lg, xl, 2xl), and copy-ready CSS values. 100% client-side.
Loading tool...
What is PX to REM Converter?
The Pixel to REM Converter is a free, browser-based tool that translates CSS pixel values into rem units. It divides your pixel value by the root font-size (default 16px) to produce the correct rem value instantly, and shows the exact formula used. Alongside the main converter it provides a full conversion table from 1px to 128px, a reference of common Tailwind breakpoints (sm, md, lg, xl, 2xl) in both px and rem, quick-convert presets, and one-click copy of any value as ready-to-paste CSS. Everything runs 100% client-side, so no data is sent anywhere and the tool works offline.
Key Benefits
- Instant live conversion as you type, with the exact formula displayed for transparency
- Customizable root font-size so the tool matches any project convention, not just the 16px default
- A complete conversion table and Tailwind breakpoint reference eliminate manual calculation
- One-click copy of rem values or the whole table as TSV, ready for stylesheets or docs
- Fully client-side with no sign-up, no tracking, and offline support
Common Use Cases
- •Converting Figma or Sketch designs (in pixels) into rem-based responsive CSS
- •Building accessible, scalable typography with rem units instead of fixed pixels
- •Quickly checking Tailwind breakpoint values in rem for media queries
- •Auditing an existing codebase to replace px values with rem for better responsiveness
- •Teaching or learning CSS relative units and root font-size behavior
How to Convert Pixels to REM
- Set the Root Font-Size: Enter the root font-size (html element) in pixels. The default is 16px, which means 1rem = 16px. Adjust it if your project uses a different base, such as 10px or 20px.
- Enter Your Pixel Value: Type the pixel value you want to convert into the Pixel (px) field, or click one of the quick-convert preset buttons (8, 12, 14, 16, 20, 24, 32, 40, 48, 64).
- Read the Result: The REM field updates instantly with the converted value and shows the exact formula, for example 32px ÷ 16px = 2rem. Browse the full table and breakpoint rows for more sizes.
- Copy the CSS Value: Click the copy button next to the result to copy the value as rem, or use Copy Table to export the entire conversion table as TSV for your stylesheet or documentation.
Key Features
- Instant px-to-rem conversion with live calculation as you type — no submit button needed
- Customizable root font-size lets you match any project convention (default 16px = 1rem)
- Full conversion table from 1px to 128px with the exact rem value for every common size
- Built-in Tailwind breakpoint reference shows sm, md, lg, xl, and 2xl in both px and rem
- One-click copy of any converted value as ready-to-paste CSS (e.g. font-size: 1rem)
- 100% client-side and works offline — no data leaves your browser, no sign-up required