Key Features
Two-way conversion: type px to get rem, or rem to get px — instantly
Configurable root font size (12–20px presets or any custom value)
Live text-size preview so you can see the actual rendered size
Clickable reference table of 16 common design-system sizes
One-click copy for rem value, px value, or a commented CSS declaration
Trailing-zero-free, precise output (up to 4 decimal places)
How to Use
1Set your root font size (16px unless your project overrides it)
2Type a value into either the px or rem field — the other updates instantly
3Use the live preview to sanity-check the rendered size
4Copy the value or the commented CSS declaration
Common Use Cases
Convert a legacy px-based stylesheet to accessible rem units
Match a Figma design spec that lists sizes in px while your codebase uses rem
Check how a size scales when users bump their browser font size
Build a consistent type scale on a custom root font size
Frequently Asked Questions
How many px is 1rem?
It equals the root element's font-size — 16px in every major browser by default. This tool assumes 16px unless you change the root size field.
Why use rem instead of px?
rem scales with the user's chosen browser font size, so text remains readable for users who need larger type. px ignores that preference. WCAG recommends relative units for font sizes.
How do I convert px to rem manually?
Divide the pixel value by the root font size: with a 16px root, 24px ÷ 16 = 1.5rem. To go back, multiply — 1.5rem × 16 = 24px.
Free 3-Day Plus TrialFree tier available
Want AI Reminders, Gmail Sync & Calorie Tracking?
Meet Atlas AI on Telegram — your personal assistant with 3x daily briefings, photo meal tracking, and Google Calendar sync.
Related Design Tools
Color Palette Generator
Generate beautiful color palettes from any base color. Copy HEX, RGB, HSL.
CSS Gradient Generator
Design stunning linear, radial, and conic gradients with live preview. Copy CSS instantly.
Color Converter
Convert between HEX, RGB, HSL, and named CSS colors with live preview.
Color Contrast Checker
Check WCAG AA/AAA color contrast ratios for text and UI. Pick colors, see pass/fail instantly.