px to rem
Bidirectional conversion between pixel, rem, em, vw, and percentage units.
Free & unlimited
16px
Common size references
Conversion table
| px | rem | em | vw | % | Visual | |
|---|---|---|---|---|---|---|
| 4 | 0.25 | 0.25 | 0.2778 | 25% | ||
| 8 | 0.5 | 0.5 | 0.5556 | 50% | ||
| 10 | 0.625 | 0.625 | 0.6944 | 62.5% | ||
| 12 | 0.75 | 0.75 | 0.8333 | 75% | ||
| 14 | 0.875 | 0.875 | 0.9722 | 87.5% | ||
| 16 | 1 | 1 | 1.1111 | 100% | ||
| 18 | 1.125 | 1.125 | 1.25 | 112.5% | ||
| 20 | 1.25 | 1.25 | 1.3889 | 125% | ||
| 24 | 1.5 | 1.5 | 1.6667 | 150% | ||
| 28 | 1.75 | 1.75 | 1.9444 | 175% | ||
| 32 | 2 | 2 | 2.2222 | 200% | ||
| 36 | 2.25 | 2.25 | 2.5 | 225% | ||
| 40 | 2.5 | 2.5 | 2.7778 | 250% | ||
| 48 | 3 | 3 | 3.3333 | 300% | ||
| 56 | 3.5 | 3.5 | 3.8889 | 350% | ||
| 64 | 4 | 4 | 4.4444 | 400% | ||
| 72 | 4.5 | 4.5 | 5 | 450% | ||
| 80 | 5 | 5 | 5.5556 | 500% | ||
| 96 | 6 | 6 | 6.6667 | 600% |
Based on 16px root font size and 1440px viewport width.
Tip: Use rem for font sizes and spacing to respect user preferences. Use em for component-relative sizing. Use vw sparingly with clamp() for fluid typography.
All processing happens in your browser. No data is sent to any server.
About this tool
- 1
Set your base font size
Enter the root font size (typically 16px) that your project uses as the rem baseline.
- 2
Enter a value
Type a pixel, rem, em, or viewport unit value in the input field.
- 3
View conversions
See the equivalent value in all other units instantly, calculated from your base size.
- 4
Copy any result
Click to copy the converted value in your preferred unit.
- The default browser font size is 16px, so 1rem = 16px unless you override html { font-size }.
- Setting html { font-size: 62.5% } makes 1rem = 10px, simplifying mental math.
- Use rem for font sizes and spacing, px for borders and shadows, and vw/vh for full-screen layouts.
- Em units compound - nested em values multiply, which can cause unexpected sizing. Prefer rem for consistency.
- Bidirectional conversion between px, rem, em, vw, and vh
- Configurable base font size
- Batch conversion for multiple values at once
- Quick-reference conversion table
- Copy output in any unit with one click
- Convert a pixel-based design mockup to responsive rem-based CSS.
- Check the pixel equivalent of rem values during code review.
- Build a consistent spacing scale using rem units.
- Translate design tokens from px to relative units for a design system.
Rem is relative to the root (html) font size and is consistent everywhere. Em is relative to the parent element's font size, so it compounds when nested - 1.2em inside 1.2em becomes 1.44x the base.
Use px for values that should not scale with font size, like 1px borders, box shadows, and outline widths. Use rem for typography, spacing, and layout dimensions.
vw and vh are percentages of the browser viewport width and height. They are ideal for full-screen hero sections, responsive typography, and layouts that must fill the screen.
Related tools
View allMore in CSS & Design12
Updated